CSS:CSS 优化和提高性能的方法有哪些(三颗星)
1.加载性能:
- css 压缩:将写好的 css 进行打包压缩,可以减小文件体积。
- css 单一样式:当需要下边距和左边距的时候,很多时候会选择使用margin:top 0 bottom 0 ; 但margin-bottom:bottom;margin-left:left;执行效率会更高。
- 减少使用@import,建议使用 link,因为后者在页面加载时一起加载,前者是等待页面加载完成之后再进行加载。
2.选择器性能:
- 关键选择器(key selector)。选择器的最后面的部分为关键选择器(即用来匹配目标元素的部分)。CSS 选择符是从右到左进行匹配的。当使用后代选择器的时候,浏览器会遍历所有子元素来确定是否是指定的元素等等;
- 如果规则拥有 ID 选择器作为其关键选择器,则不要为规则增加标签。过滤掉无关的规则(这样样式系统就不会浪费时间去匹配它们了)。
- 避免使用通配规则,如*{}计算次数惊人,只对需要用到的元素进行选择。
- 尽量少的去对标签进行选择,而是用 c
剩余60%内容,订阅专栏后可继续查看/也可单篇购买
前端面试题 文章被收录于专栏
前端面试的一些常问问题、问题的具体实现(可直接运行)以及底层原理
