Apa yang harus saya gunakan untuk secara otomatis menggabungkan file css / js?

14

Saya mengetahui sprocket untuk menggabungkan file javascript, tetapi belum mencobanya. Apa sajakah pilihan lain dan bagaimana mereka menumpuk?

optimization javascript css Cebjyre
sumber
2
Juga, walaupun bukan jawaban yang nyata, Anda mungkin tertarik pada paket sumber daya: limi.net/articles/resource-packages Sayangnya, saya belum berpikir ada yang mengimplementasikannya.
Luiscubal

Jawaban:

2

Saya sudah membahas masalah ini dalam pertanyaan lain

Kalau dipikir-pikir, saya seharusnya bertanya di Webmaster bukan situs Programmer.

Anda memiliki 3 opsi:

  1. Biarkan kerangka kerja Anda menanganinya secara otomatis
  2. Biarkan server web Anda menanganinya secara otomatis
  3. Gulung opsi Anda sendiri untuk melakukannya secara manual

Opsi 1 (menggunakan ekstensi CakePHP):

Unduh dan pasang AssetPacker ke situs Anda (yang juga memerlukan jsmin dan CSSTidy). Ubah beberapa baris sumber Anda yang menyertakan file js. Cuci-> Bilas-> Ulangi. Voila, sisanya dilakukan secara otomatis untuk Anda.

Jika Anda menggunakan beberapa kerangka kerja lain, kemungkinan besar, ada alat yang akan mencapai ini untuk Anda. Ini adalah persyaratan yang cukup umum di dunia webdev.

Opsi 2 (menggunakan mod Apache):

Lihatlah mod Google Pagespeed untuk Apache . Itu melakukan semua yang Anda jelaskan dan banyak lagi.

Pastikan untuk memonitor sumber daya server produksi Anda. Beberapa orang telah melihat masalah di mana ini meningkatkan beban di server mereka dengan cara yang buruk. Saya tidak positif tetapi mungkin memerlukan strategi konten statis yang cukup untuk menjadi pilihan yang efektif.

Opsi 3:

Jika Anda benar-benar ingin, Anda dapat membuat beberapa keajaiban PHP yang menggabungkan sisi server file JS dan menggabungkan semua rel tautan menjadi satu tetapi ... Itulah yang sebenarnya dilakukan oleh kedua strategi tersebut.

Secara pribadi, saya akan sangat menyarankan terhadap opsi ini.

Sejauh yang saya tahu Sprockets menggabungkan file JS sama dengan AssetPacker, itu hanya diimplementasikan sebagai Ruby Gem. Yang tidak dilakukannya adalah mengecilkan kode js. Jadi, jika Anda menggunakannya, mungkin ide yang baik untuk mengambil permata jsmin juga. Untuk informasi tentang cara menggunakan Sprockets + JSMin di CakePHP lihat ini .

Saya tahu saya memberi penekanan pada CakePHP tapi ... Saya berasumsi bahwa, jika sebuah plugin dapat disesuaikan dengan CakePHP, itu seharusnya sepele untuk mengadaptasinya ke kerangka kerja yang berbeda juga.

Evan Plaice
sumber
1

Apakah Anda yakin ingin menggabungkannya? Jika Anda menggunakan perpustakaan umum, Anda dapat memanfaatkan CDN untuk mengirimkan javascripts Anda. Anda kemudian dapat mengambil keuntungan dari caching browser (dengan asumsi situs lain menggunakan CDN yang sama) dan pengiriman yang didistribusikan. Microsoft dan Google masing-masing memiliki solusi (saya juga tidak jujur ​​menggunakan, tapi saya pasti akan memulai) dan mungkin ada yang lain.

Larry Smithmier
sumber
1

Untuk proyek ASP.NET, saya telah menjadikannya bagian dari proses pembangunan saya berdasarkan instruksi oleh Karl Seguin .

Karl menggambarkannya dengan paling baik di blog-nya, tetapi versi singkatnya adalah membuat aplikasi pembungkus konsol YUICompresor. Kemudian Anda dapat mengatur tugas pasca-pembangunan untuk memanggil aplikasi konsol tersebut terhadap lokasi file JS di situs Anda.

Raleigh Buckner
sumber
1

Jika aplikasi web Anda menggunakan PHP, Anda harus mempertimbangkan untuk menggunakan minify :

Ini menggabungkan beberapa file CSS atau Javascript, menghapus spasi dan komentar yang tidak perlu, dan melayani mereka dengan pengkodean gzip dan header cache sisi klien yang optimal.

Tom
sumber
1

Untuk mengetahui Python ini sebenarnya mungkin berguna. Anda dapat mempelajari Python dengan cukup cepat. Saya mulai sekitar 2 minggu yang lalu dan aplikasi pertama saya (yang masih belum selesai) akan melakukan hal yang sama persis seperti yang Anda inginkan. Seperti kompiler DotLess, ia akan memiliki fungsi menonton yang akan melihat file atau direktori dan jika mereka mengubahnya akan menghasilkan file baru.

Python juga bagus untuk tugas-tugas pemeliharaan lainnya dan saya membaca banyak administrator sistem ingin menggunakannya.

Acar
sumber
Saya sendiri lebih seperti Perl, dan saya mungkin bisa meretas sesuatu bersama-sama, tetapi saya lebih suka menggunakan beberapa alat yang sudah ada sebelumnya (dengan, mungkin, pengujian yang lebih baik dan lebih banyak fitur daripada upaya cepat & kotor saya akan memiliki).
Cebjyre
Promosi diri yang mengerikan tetapi @Pickels, apakah Anda tertarik untuk membantu proyek ini? code.google.com/p/lesscss-python
Metalshark
0

Saya membuat Minifpy : alat yang ditulis dengan Python3 (kompatibel dengan Mac OS, Windows dan Linux) untuk menggabungkan dan memperkecil file JS dan CSS dengan menggunakan Python.

Minifpy menggunakan file konfigurasi JSON yang sangat mudah untuk menentukan file mana yang harus digabung, diperkecil atau tidak: 

{
    "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"}
        ]
    }
}

Anda juga dapat menggunakan alat ini di CLI.

Minifpy mendeteksi modifikasi apa pun pada file JS / CSS dan menggabungkan / memperkecilnya secara otomatis (berguna untuk pengembangan).

Samuel Dauzon
sumber