it-swarm.it

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

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

14
Cebjyre

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/13091

4
travis

Ho già affrontato questo problema in n'altra domanda

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

Hai 3 opzioni:

  1. Lascia che il tuo framework lo gestisca automaticamente
  2. Lascia che il tuo server web lo gestisca automaticamente
  3. 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 Apache):

Dai un'occhiata al mod 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 una gemma Ruby. 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 .

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.

2
Evan Plaice

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

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

1
Tom

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

1
Macha

Sei sicuro di voler combinarli? Se si utilizza una libreria comune, è possibile sfruttare un CDN per consegnare i propri javascript. È quindi possibile sfruttare la memorizzazione nella cache del browser (presupponendo che altri siti utilizzino la stessa rete CDN) e la distribuzione distribuita. Microsoft e Google ognuno ha delle soluzioni (non l'ho nemmeno usato onestamente, ma sicuramente inizierò) e potrebbero essercene altri.

1
Larry Smithmier

Per i progetti ASP.NET, l'ho reso parte del mio processo di compilazione basato su 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.

1
Raleigh Buckner

Per questo sapere 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.

1
Pickels

Ho creato Minifpy : uno strumento scritto in Python3 (compatibile con Mac OS, Windows e Linux) per unire e minimizzare i file JS e CSS usando 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).

0
Samuel Dauzon