Cosa devo usare per combinare automaticamente i file css / js?

14

Sono a conoscenza di ruote dentate per la combinazione di file javascript, ma non l'ho provato. Quali sono alcune altre opzioni e come si accumulano?

optimization javascript css

— Cebjyre
fonte

2

Inoltre, sebbene non sia una vera risposta, potresti essere interessato ai pacchetti di risorse: limi.net/articles/resource-packages Sfortunatamente, non credo che nessuno l'abbia ancora implementata.

— luiscubal,

4

Ho scritto un gestore per Asp.Net che utilizza YUI per comprimere, concatenare e memorizzare nella cache l'output.

Ecco la fonte: http://gist.github.com/130913

— travis
fonte

2

Ho già affrontato questo problema in un'altra domanda

Col senno di poi, avrei dovuto chiederlo ai webmaster invece che al sito dei programmatori.

Hai 3 opzioni:

Lascia che il tuo framework lo gestisca automaticamente
Lascia che il tuo server web lo gestisca automaticamente
Ruota la tua opzione per farlo manualmente

Opzione 1 (usando un'estensione CakePHP):

Scarica e installa AssetPacker nel tuo sito (che richiede anche jsmin e CSSTidy). Modifica alcune righe di sorgente che includono i file js. Wash> Rinse-> Ripeti. Voila, il resto è fatto automaticamente per te.

Se usi qualche altro framework, è probabile che ci sia uno strumento che lo realizzerà per te. È un requisito abbastanza comune nel mondo webdev.

Opzione 2 (usando una mod di Apache):

Dai un'occhiata alla mod di Google Pagespeed per Apache . Fa tutto ciò che descrivi e molto di più.

Assicurati di monitorare le risorse del tuo server di produzione. Alcune persone hanno riscontrato problemi in cui ciò aumenta il carico sul proprio server in modo negativo. Non sono positivo ma potrebbe essere necessaria una strategia di contenuto statico sufficiente per essere un'opzione efficace.

Opzione 3:

Se vuoi davvero, potresti creare un po 'di magia PHP che concatena il lato server dei file JS e combina tutti i collegamenti dei link in uno ma ... Questo è esattamente ciò che le due strategie stanno già facendo comunque.

Personalmente, sconsiglio vivamente questa opzione.

Per quanto ne so, Sprockets concatena i file JS allo stesso modo di AssetPacker, è appena implementato come Ruby Gem. Quello che non fa è minimizzare il codice js. Quindi, se lo usi, probabilmente è una buona idea prendere anche la gemma jsmin. Per informazioni su come usare Sprockets + JSMin in CakePHP, dai un'occhiata a questo .

So di porre l'accento su CakePHP ma ... suppongo che, se un plugin può essere adattato a CakePHP, dovrebbe essere banale adattarlo anche a un diverso framework.

— Evan Plaice
fonte

1

Una rapida ricerca su Google trova questo per combinare i file CSS: http://www.tothepc.com/archives/combine-merge-multiple-css-files/

— Macha
fonte

Sfortunatamente C # non è davvero appropriato per i miei scopi, ma spero che qualcuno ne trarrà beneficio

— Cebjyre,

1

Sei sicuro di voler combinarli? Se usi una libreria comune, puoi sfruttare un CDN per consegnare i tuoi javascript. È quindi possibile sfruttare la memorizzazione nella cache del browser (presupponendo che altri siti stiano utilizzando la stessa rete CDN) e la distribuzione distribuita. Microsoft e Google hanno ciascuna delle soluzioni (non l'ho nemmeno usata onestamente, ma sicuramente inizierò) e potrebbero essercene altre.

— Larry Smithmier
fonte

1

Per i progetti ASP.NET, l'ho reso parte del mio processo di compilazione basato sulle istruzioni di Karl Seguin .

Karl lo descrive meglio sul suo blog, ma la versione breve è quella di configurare un'app console che avvolge YUICompressor. Quindi puoi impostare un'attività post-build per chiamare l'app console in base alla posizione dei file JS nel tuo sito.

— Raleigh Buckner
fonte

1

Se la tua webapp è in PHP dovresti considerare di usare minify :

Combina più file CSS o Javascript, rimuove spazi bianchi e commenti non necessari e li serve con codifica gzip e intestazioni cache lato client ottimali.

— Tom
fonte

1

Per questo, Python potrebbe effettivamente essere utile. Puoi imparare Python abbastanza rapidamente. Ho iniziato circa 2 settimane fa e la mia prima applicazione (che non è ancora finita) farà esattamente la stessa cosa che desideri. Come il compilatore DotLess avrà una funzione watch che guarderà i file o le directory e se cambiano genererà un nuovo file.

Python è ottimo anche per altre attività di manutenzione e leggo molti amministratori di sistema che amano usarlo.

— pickels
fonte

Sono più un ragazzo del Perl, e probabilmente potrei hackerare qualcosa insieme, ma preferirei usare alcuni strumenti preesistenti (con, presumibilmente, test migliori e più funzionalità di quanto il mio sforzo rapido e sporco avrebbe).

— Cebjyre,

Auto-promozione orribile ma @Pickels, saresti interessato ad aiutare questo progetto? code.google.com/p/lesscss-python

— Metalshark

0

Ho creato Minifpy : uno strumento scritto in Python3 (compatibile con Mac OS, Windows e Linux) per unire e minimizzare i file JS e CSS utilizzando Python.

Minifpy utilizza un file di configurazione JSON molto semplice per definire quali file devono essere uniti, minimizzati o meno:

{
    "js": {
        "minify_files": [
            {"from": "static/file.js", "to":"static/file.min.js"},
        ],
        "merge_files": [
            {"from" : ["static/file1.js", "static/file2.js"], "to":"static/public.js", "to_min": "static/public.min.js"}
        ]
    },
    "css" : {
        "minify_files": [
            {"from": "static/file.css", "to":"static/file.min.css"},
        ],
        "merge_files": [
            {"from" : ["static/file1.css", "static/file2.css"], "to":"static/public.css", "to_min": "static/public.min.css"}
        ]
    }
}

Puoi anche usare questo strumento nella CLI.

Minifpy rileva eventuali modifiche sui file JS / CSS e le unisce / minimizza automaticamente (utile per lo sviluppo).

— Samuel Dauzon
fonte