预测在高负载项目上安装 LESS、CSS3PIE 的后果

Posted 2023-05-08

【中文标题】预测在高负载项目上安装 LESS、CSS3PIE 的后果

【英文标题】：Predict consequences of installing LESS, CSS3PIE on a high-load project

【发布时间】：2011-11-29 23:13:56

【问题描述】：

我面临全球网站重新设计的情况（不是外观，而是代码架构和底层技术）。网站每天约有 135 000 名访问者。现在做出正确的决定至关重要。

我以前没有在这么大的项目上使用过 LESS 和 CSS3PIE 的经验。也许你们中的一些人可以预测我在使用上述技术时会遇到的一些麻烦。我想知道优点和缺点。

对带有阴影和渐变的圆角按钮使用经过测试且可靠的旧方法（例如精灵）不是更好吗？我看http://zappos.com。它们只是在 IE 中优雅地降级并且不使用 CSS3PIE。

【参考方案1】：

没有人回答我，所以我试着回答自己。由于所有主要平台（Ruby、.NET、php）都有服务器端 LESS 编译器，我决定使用 LESS 但编译服务器端而不是使用 LESS.js，这不好，因为它会阻止客户端的浏览器缓存 CSS。

关于 CSS3PIE，我认为使用它没有任何明显的缺点，使用 IE 的客户端会增加一点负载，但还不错。

我现在可以预见的唯一问题是背景和装饰在弹出窗口中消失了。我已经遇到过这个问题并在这里发布了一个问题，但没有人回答。

【参考方案2】：

我会避免将 CSS3Pie 用于生产网站。根据我的经验，页面上 CSS3Pie 渲染元素的数量越多，IE8/9 的性能就越差。

具体来说，当我在 IE8 文档模式下使用 IE9 并使用 CSS3Pie 渲染至少 2 个元素（使用边框半径和线性渐变）时，我观察到滚动浏览器窗口时出现明显的延迟。也就是说，我会尝试向下滚动页面，滚动条需要几秒钟才能“赶上”鼠标指针。

我关闭 CSS3Pie 后，就没有观察到滚动时的延迟。根据我的经验，这同样适用于 IE8。