在網(wǎng)站建設(shè)的過程中，CSS 框架提供了加速網(wǎng)站和應(yīng)用程序設(shè)計擴展過程的方法。但是，一般來說，大多數(shù) CSS 框架都擠滿了通?？床坏绞锕獾墓δ?。值得慶幸的是，對于更簡單的項目，有很多最小/輕量級的解決方案。

當(dāng)有人提到CSS frameworks這個詞時，很多人首先想到的是 Bootstrap、Tailwind CSS 或 Semantic UI。很公平。它們都是用于構(gòu)建復(fù)雜而深入的布局結(jié)構(gòu)的令人難以置信的框架。但是一般來說，此類框架適用于設(shè)計跨越多個頁面的項目。對于一個簡單的項目——投資組合、博客、簡歷頁面——一個包大小為50kb+的框架似乎有點矯枉過正。

我認為現(xiàn)在現(xiàn)代網(wǎng)站開發(fā)中發(fā)生的趨勢之一是開發(fā)人員根本不關(guān)心他們最終設(shè)計的頁面大小。一旦所有 JavaScript 完成渲染，今天網(wǎng)頁的平均大小約為 2.5Mb 。至少可以說，這有點瘋狂。對我來說，輕量級 CSS 框架為我提供了創(chuàng)建主容器、為它們分配一些元素的工具，然后我可以在需要時專注于自定義樣式。我不需要拘泥于在實踐中永遠不會使用的規(guī)則和設(shè)計選項。

正如我之前所說，現(xiàn)代框架的包大小可能高得離譜。這個包大小示例與直接通過 CDN 獲取框架的上下文相關(guān)。通?？梢詫⑤^大框架的大小減小到更適中的程度。但是，開箱即用的框架，如Tailwind CSS或 Bootstrap ，在默認情況下并不旨在實現(xiàn)最小化或輕量級。

除了性能的直接改進之外，還有哪些使用更小的 CSS 框架的其他原因？就個人而言，我喜歡使用一個可以讓我快速訪問預(yù)定義布局和其他樣式組件的框架的想法。這一切都不需要我做代碼體操來讓設(shè)計在多個設(shè)備上工作。

此外，較小的框架具有更寬容的學(xué)習(xí)曲線。特別是，如果您剛開始自己設(shè)計樣式 - 輕量級框架可幫助您了解設(shè)計如何在準系統(tǒng)級別組合在一起。并且不需要依賴 JavaScript 也有很長的路要走。最后但同樣重要的是，由于沒有類干擾，將自定義 CSS 添加到小型框架基礎(chǔ)要容易得多。當(dāng)您沒有一千個相互依賴的不同類時，添加您在教程或 CodePen 等網(wǎng)站上找到的自定義 CSS 片段會容易得多。