TechnoPat #11 - Perbedaan Bootstrap dengan Tailwind CSS

Sunday, 21 November 2021

Tailwind Css adalah framework css yang semua properti cssnya telah ditulis sebelumnya sebagai class, kemudian menggunakan class tersebut untuk menerapkan properti css. Sedangkan Bootstrap merupakan framework CSS yang dirancang untuk siap pakai. Bagaimanan maksud nya? Jadi, Bootstrap memiliki class yang sudah di style kemudian class tersebut bisa langsung dipakai ke setiap elemen html

Kumpulan komponen dasar

Dalam hal ini, saya harus mengatakan bahwa Bootstrap memiliki keunggulan yang jelas karena kumpulan komponennya yang luas termasuk kartu, modals, akordeon, tab navigasi, dan sebagainya. Tailwind CSS hanya memiliki sedikit komponen menurut dokumentasinya, daftar lengkapnya adalah:

1. Peringatan
2. Tombol
3. Kartu-kartu
4. Formulir
5. Kisi Flexbox
6. Navigasi

Performa

Bootstrap memi liki 4 file yang harus dimasukkan ke dalam proyek Anda untuk mendapatkan manfaat penuh dari Kerangka CSS. Bersama-sama mereka berjumlah hingga 308.25kb termasuk jQuery, Popper.js, Bootstrap JS dan file CSS Bootstrap utama.

Sebagai perbandingan, Tailwind CSS hanya memerlukan file stylesheet dasar yang jumlahnya hingga 27kb. Memang benar bahwa Bootstrap memiliki kumpulan komponen dan fungsionalitas yang jauh lebih besar, namun jika Anda tidak memerlukan komponen tertentu seperti modals atau akordeon, mungkin Tailwind adalah pilihan yang lebih baik untuk proyek yang lebih ringan.