-
Reusability
- Modul bisa digunakan kembali oleh bagian program lain atau bisa menjadi package untuk app lain.
-
Isolation
- Satu modul mengerjakan hanya hal yang spesifik saja.
-
Organization
- Kemudahan pengelolaan aplikasi secara keseluruhan.
- Harus membuat fungsi pembungkus / wrapper function
- Agar memiliki scope, sehingga tidak ada global variable
- Tetap muncul function wrapper yang bisa diakses secara global
- Kurang reusable
- Masalah pengelolaan dependency
- Tidak perlu membuat nama function
- Tidak perlu menjalankan function
- Tidak ada function yang bisa diakses secara global
- Harus ditulis di setiap module
- Masih bukan module system
- Menggunakan keyword module.exports dan require()
- Diterapkan di dalam nodeJS
- Butuh module bundler jika ingin dijalankan di browser
- Menggunakan keyword exports dan import
- Asynchronous
- Tidak butuh module bundler jika ingin dijalankan di browser
- Tambahkan type="module" saat pemanggilan script
Sebuah tool yang mengambil code-code javascript yang kita gunakan (beserta dengan dependency-nya) dan mem-bundle/menggabungkannya menjadi sebuah file (biasanya untuk digunakan di browser).
- Melakukan penggabungan dan pengelolaan dependencies secara otomatis
- Melakukan minify/uglify terhadap file agar ukurannya menjadi semakin kecil
- browserify.org
- webpack.js.org
- rollupjs.org
- parceljs.org
- snowpack.dev
- vitejs.dev
- Dependency management
- Hot module replacement
- Caching
- Supported modules: ES Modules, CommonJS, AMD Modules
- Transpile older JS
- Bundle CSS & Images
- Asset optimization
- Increase developer productivity & experience
- Entry
- Output
- Mode
- Loaders
- Plugins
- Browser Compatibility
Melakukan bundle pada sumber daya statis selain javascript.
Sebuah teknik untuk menyimpan data di dalam komponen hardware atau software, dilakukan agar request (berikutnya) untuk data tersebut terjadi dengan lebih cepat.
hard refresh - Ctrl + Shift + R
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent