Bundling adalah alat yang digunakan untuk menggabungkan beberapa file, seperti JavaScript, CSS, atau gambar, menjadi satu file atau sejumlah kecil file. Kode yang diperkecil yang dihasilkan dapat disajikan ke browser sebagai satu permintaan HTTP.

Minifikasi adalah proses menghapus karakter yang tidak perlu, seperti spasi dan komentar, dari kode. Berikut adalah contoh bagaimana bundling dan minifikasi dapat menyederhanakan kode:

// Before bundling and minification
var test = [];
for (var i = 0; i < 100; i++) {
  test[i] = i;
}

// After bundling and minification
for(var a=[i=0];++i<20;a[i]=i);

• Ukuran file lebih kecil : Kode yang diperkecil dapat diambil dari server lebih cepat, yang meningkatkan kinerja.
• Pengurangan waktu parsing : Kode yang diperkecil seringkali lebih mudah dan lebih cepat untuk diuraikan daripada kode yang tidak diperkecil karena memiliki lebih sedikit karakter dan lebih ringkas.
• Mengurangi lalu lintas jaringan : Bundling mengurangi jumlah permintaan yang dibuat ke server, yang berarti lebih sedikit bandwidth yang diperlukan untuk mentransfer data melalui jaringan.

Dalam situasi terbaik, kami membagi JavaScript menjadi beberapa file dan memanggilnya seperti ini:

<script src="//code.jquery.com/jquery-1.12.0.min.js"></script>
<script src="/js/foo.js"></script>
<script src="/js/bar.js"></script>
<script src="/js/foobar.js"></script>
<script>
// Here goes some code
</script>

Selain itu, mengambil banyak file melalui jaringan dapat memperlambat situs web Anda. Saat Anda membuat permintaan untuk file JavaScript, browser harus menjeda pemuatan halaman hingga menerima file. Inilah mengapa bundling itu penting. Menggabungkan semua file JavaScript ke dalam satu file mengurangi jumlah permintaan yang dibuat ke server, yang dapat meningkatkan kinerja situs web Anda.

Kami mungkin memiliki lusinan atau bahkan ratusan file JavaScript dalam sebuah proyek. Bundling dapat membantu mengurangi jumlah permintaan yang dibuat ke server, yang dapat meningkatkan kinerja situs web Anda.

Kesimpulannya

Bundling adalah teknik penting untuk mengoptimalkan kinerja aplikasi web. Dengan menggabungkan beberapa file menjadi satu bundel, Anda dapat mengurangi jumlah permintaan yang dibuat ke server, meningkatkan performa jaringan, dan membuat kode Anda lebih mudah diurai.