Saya menggunakan jquery dalam aplikasi web saya dan saya perlu memuat lebih banyak file script jquery ke dalam satu halaman.
Google menyarankan agar saya menggabungkan semua file script jquery menjadi satu file.
Bagaimana saya bisa melakukan ini?
Saya menggunakan jquery dalam aplikasi web saya dan saya perlu memuat lebih banyak file script jquery ke dalam satu halaman.
Google menyarankan agar saya menggabungkan semua file script jquery menjadi satu file.
Bagaimana saya bisa melakukan ini?
Jawaban:
Di linux Anda dapat menggunakan skrip shell sederhana https://github.com/dfsq/compressJS.sh untuk menggabungkan beberapa file javascript menjadi satu. Itu memanfaatkan layanan online Closure Compiler sehingga skrip yang dihasilkan juga dikompresi secara efektif.
$ ./compressJS.sh some-script.js another-sctipt.js onemore.js
Coba kompiler penutupan google:
http://code.google.com/closure/compiler/docs/gettingstarted_ui.html
Cukup gabungkan file teks dan kemudian gunakan sesuatu seperti YUI Compressor .
File dapat dengan mudah digabungkan menggunakan perintah cat *.js > main.js
dan main.js kemudian dapat dijalankan melalui kompresor YUI menggunakan java -jar yuicompressor-x.y.z.jar -o main.min.js main.js
.
Perbarui Agustus 2014
Saya sekarang telah bermigrasi untuk menggunakan Gulp untuk penggabungan dan kompresi javascript seperti dengan berbagai plugin dan beberapa konfigurasi minimal Anda dapat melakukan hal-hal seperti mengatur dependensi, menyusun coffeescript dll serta mengompresi JS Anda.
Anda dapat melakukannya melalui
include
semuanya dan output menjadi sebuah <script>
taginclude
yaitu jangan lakukan <script src = "...."> menautkan ke banyak file, cukup masukkan ke dalam satu elemen skrip. Idealnya cdn bersama dengan caching yang tepat harus digunakan.
Saya biasanya memilikinya di Makefile
:
# All .js compiled into a single one.
compiled=./path/of/js/main.js
compile:
@find ./path/of/js -type f -name "*.js" | xargs cat > $(compiled)
Kemudian Anda lari:
make compile
Saya harap ini membantu.
Saya menggunakan skrip shell ini di Linux https://github.com/eloone/mergejs .
Dibandingkan dengan skrip di atas, skrip ini memiliki kelebihan karena sangat mudah digunakan, dan nilai tambahnya adalah Anda dapat mencantumkan file js yang ingin Anda gabungkan dalam file teks masukan dan bukan di baris perintah, sehingga daftar Anda dapat digunakan kembali dan Anda tidak perlu mengetiknya setiap kali ingin menggabungkan file Anda. Ini sangat berguna karena Anda akan mengulangi langkah ini setiap kali Anda ingin masuk ke produksi. Anda juga dapat mengomentari file yang tidak ingin Anda gabungkan dalam daftar. Baris perintah yang kemungkinan besar akan Anda ketik adalah:
$ mergejs js_files_list.txt output.js
Dan jika Anda ingin juga mengompres file gabungan yang dihasilkan:
$ mergejs -c js_files_list.txt output.js
Ini akan membuat output-min.js
dikecilkan oleh kompiler penutupan Google. Atau :
$ mergejs -c js_files_list.txt output.js output.minified.js
Jika Anda menginginkan nama tertentu untuk file yang diperkecil bernama output.minified.js
Saya merasa sangat membantu untuk situs web sederhana.
Pengelompokan skrip kontraproduktif, Anda harus memuatnya secara paralel menggunakan sesuatu seperti http://yepnopejs.com/ atau http://headjs.com
Salin skrip ini ke notepad dan simpan sebagai file .vbs. Seret & Jatuhkan file .js pada skrip ini.
ps. Ini hanya akan berfungsi di windows.
set objArgs = Wscript.Arguments
set objFso = CreateObject("Scripting.FileSystemObject")
content = ""
'Iterate through all the arguments passed
for i = 0 to objArgs.count
on error resume next
'Try and treat the argument like a folder
Set folder = objFso.GetFolder(objArgs(i))
'If we get an error, we know it is a file
if err.number <> 0 then
'This is not a folder, treat as file
content = content & ReadFile(objArgs(i))
else
'No error? This is a folder, process accordingly
for each file in folder.Files
content = content & ReadFile(file.path)
next
end if
on error goto 0
next
'Get system Temp folder path
set tempFolderPath = objFso.GetSpecialFolder(2)
'Generate a random filename to use for a temporary file
strTempFileName = objFso.GetTempName
'Create temporary file in Temp folder
set objTempFile = tempFolderPath.CreateTextFile(strTempFileName)
'Write content from JavaScript files to temporary file
objTempFile.WriteLine(content)
objTempFile.Close
'Open temporary file in Notepad
set objShell = CreateObject("WScript.Shell")
objShell.Run("Notepad.exe " & tempFolderPath & "\" & strTempFileName)
function ReadFile(strFilePath)
'If file path ends with ".js", we know it is JavaScript file
if Right(strFilePath, 3) = ".js" then
set objFile = objFso.OpenTextFile(strFilePath, 1, false)
'Read entire contents of a JavaScript file and returns it as a string
ReadFile = objFile.ReadAll & vbNewLine
objFile.Close
else
'Return empty string
ReadFile = ""
end if
end function
Anda dapat menggunakan Closure-compiler seperti yang disarankan oleh orangutan. Perlu diketahui bahwa Anda tidak benar-benar perlu mengkompilasi / mengecilkan JavaScript, seharusnya mungkin untuk hanya menggabungkan file teks JavaScript ke dalam satu file teks. Cukup gabungkan mereka dalam urutan yang biasanya mereka masukkan dalam laman.
Jika Anda menjalankan PHP, saya merekomendasikan Minify karena itu menggabungkan dan meminimalkan dengan cepat untuk CSS dan JS. Setelah Anda mengonfigurasinya, bekerjalah seperti biasa dan itu akan menangani semuanya.
Anda dapat menggunakan KjsCompiler: https://github.com/knyga/kjscompiler Manajemen ketergantungan keren
Anda bisa menggunakan script yang saya buat. Anda membutuhkan JRuby untuk menjalankan ini. https://bitbucket.org/ardee_aram/jscombiner (JSCombiner).
Yang membedakannya adalah ia melihat perubahan file di javascript, dan menggabungkannya secara otomatis ke skrip pilihan Anda. Jadi tidak perlu "membangun" javascript Anda secara manual setiap kali Anda mengujinya. Semoga membantu Anda, saya sedang menggunakan ini.
Ini mungkin sedikit usaha tetapi Anda dapat mengunduh proyek wiki sumber terbuka saya dari codeplex:
http://shuttlewiki.codeplex.com
Ini berisi proyek CompressJavascript (dan CompressCSS) yang menggunakan proyek http://yuicompressor.codeplex.com/ .
Kode harus cukup jelas tetapi itu membuat menggabungkan dan mengompresi file sedikit lebih sederhana --- untuk saya sih :)
Proyek ShuttleWiki menunjukkan bagaimana menggunakannya dalam acara pasca-pembangunan.