𝗠𝗲𝗻𝘆𝗲𝗱𝗲𝗿𝗵𝗮𝗻𝗮𝗸𝗮𝗻 𝗩𝗶𝘁𝗲

Alat lama seperti Webpack atau Create React App bekerja dengan membundel seluruh proyek Anda terlebih dahulu. Alat tersebut membaca setiap file dan mengubahnya menjadi satu file JavaScript raksasa. Ini berhasil untuk proyek kecil, namun gagal untuk proyek besar. Pada proyek besar, proses ini memakan waktu berdetik-detik. Setiap kali Anda menyimpan file, alat tersebut harus mengulang sebagian besar pekerjaan itu.

Vite bekerja secara berbeda. Browser modern mendukung ES modules secara native. Ini berarti browser dapat menangani import dan export sendiri. Vite tidak membundel kode Anda selama pengembangan. Vite menyajikan setiap file sebagai modul terpisah hanya saat browser memintanya.

Bayangkan sebuah restoran prasmanan. Koki memasak setiap hidangan sebelum pintu dibuka. Jika Anda menginginkan satu perubahan kecil, koki harus membuat ulang seluruh prasmanan tersebut. Begitulah cara kerja Webpack. Semakin besar proyeknya, semakin lama Anda menunggu.

Vite seperti restoran à la carte. Pintu langsung dibuka. Anda memesan satu hidangan. Koki hanya menyiapkan hidangan tersebut. Jika Anda ingin pencuci mulut nanti, koki hanya menyiapkan pencuci mulutnya saja. Anda tidak perlu menunggu seluruh menu siap.

Vite menggunakan dua strategi berbeda untuk dua kebutuhan yang berbeda:

Pengembangan (vite dev) • Strategi: Menyajikan modul ESM native tanpa pembundelan. • Kecepatan mulai: Instan. Tidak bergantung pada ukuran proyek. • Mengapa: Permintaan HTTP lokal sangat cepat di komputer Anda.

Produksi (vite build) • Strategi: Membundel semuanya menggunakan Rolldown. • Kecepatan mulai: Waktu bertambah seiring dengan ukuran proyek. • Mengapa: Ratusan file terpisah menyebabkan terlalu banyak permintaan HTTP bagi pengguna. Pembundelan mengatasi hal ini.

Vite memberikan Anda kecepatan saat menulis kode dan efisiensi saat meluncurkan aplikasi.

Sumber: https://dev.to/yuripeixinho/descomplicando-o-vite-1p62