用好 CSS 的三角函數，讓佈局更聰明
在日常開發中，我們經常用calc()、var()來讓樣式變得動態可控。但其實，CSS 還能做更“數學化”的計算——從 CSS Values Level 4 開始，瀏覽器支持了sin()、cos()、tan()等三角函數。 這意味着，我們在樣式中，也能像在 JavaScript 裏那樣，直接用角度計算出幾何關係，讓佈局、動畫更自然、更精準。 一、CSS 三角函數是什麼？
昵称 子丶不語
贡献者2
粉丝0
在日常開發中，我們經常用calc()、var()來讓樣式變得動態可控。但其實，CSS 還能做更“數學化”的計算——從 CSS Values Level 4 開始，瀏覽器支持了sin()、cos()、tan()等三角函數。 這意味着，我們在樣式中，也能像在 JavaScript 裏那樣，直接用角度計算出幾何關係，讓佈局、動畫更自然、更精準。 一、CSS 三角函數是什麼？
昵称 子丶不語
前端虛擬長列表 當一次性渲染十萬條 DOM 節點時，瀏覽器會瞬間陷入「卡頓—白屏—崩潰」三連擊。虛擬長列表（Virtual Scroller）把「按需渲染」做到極致：只繪製可見區域並加少量緩衝，讓巨量數據在低端設備也能保持 60 FPS。 一、問題本質：渲染成本與滾動成本的矛盾 渲染成本等於節點數量乘以單個節點複雜度，滾動成本等於佈局重排乘以樣式重繪。瀏覽器單幀預算約 16
昵称 前端小巷子