`
fuhao_987
  • 浏览: 63678 次
  • 性别: Icon_minigender_2
  • 来自: 北京
社区版块
存档分类
最新评论

加快网站速度的最佳做法_(4)避免使用css表达式

阅读更多
CSS表达式是一个强大的方法,可以使得CSS属性动态的改变。在IE5.0的版后得到支持,但是在IE8中被剔除了。作为一个例子,背景色可以用CSS表达式设置成每隔一个小时改变。
    /*code里面没有cs只有用java代替,见谅见谅*/
    background-color:expression( (new Date()).getHours()%2 ? "#B8D4FF":"#F08A00");

正如上面所示,表达式方法接受js表达式。CSS的属性值是这个JS表达式的结果。这个表达式只有在IE中才能使用,并且只有在需要创建一个跨浏览器的一致体验时才能用到。

使用表达式的问题是,表达式的计算频率比人们想象的要高的多。不只是在页面被渲染或者是改变的时候,当人们在页面上滑动滚动条,甚至是在页面上移动鼠标的时候,表达式都会被计算。在CSS表达中的增加计数器可以帮助我们监控CSS表达式被计算的次数。在页面上移动鼠标很容易就产生超过10000次的表达式计算(运行)。

一种减少CSS表达式计算的方法是使用一次(one-time)表达式,当表达式第一次被计算的时候,它就对样式设置了一个明确的值,这样来代替表达式的不断计算。如果样式的属性必须根据页面的情况动态的来设定,使用事件捕捉(event handlers)的方法而不是css表达式。如果你一定要使用css表达式,记住它们也许会被计算上千次,这会影响你的页面的性能。
分享到:
评论

相关推荐

    雅虎给出的34条优化网站访问速度加快方法

    5. **避免CSS表达式**:CSS表达式在IE6和7中会导致重绘问题,影响页面性能,应尽可能避免使用。 6. **使用外部JavaScript和CSS**:将CSS和JavaScript放在外部文件中,可以利用浏览器缓存,减少后续页面加载时间。 ...

    CSS重构:样式表性能调优

    14. **避免使用CSS表达式**:虽然它们可以实现动态计算,但代价是性能损失,尤其是在老版本的IE浏览器中。 15. **维护和更新**:定期审查和更新CSS,删除废弃或冗余的样式,保持代码整洁。 综上所述,CSS重构和...

    优化Windows Server自带的互联网信息服务器(IIS).doc

    7. **避免CSS表达式**:CSS表达式计算频繁,可能导致性能问题,应尽量避免使用。 8. **使用外部JavaScript和CSS**:将这些文件作为外部资源引用,有利于浏览器缓存,减少重复下载。 9. **减少DNS查询**:限制页面...

    Lecture_8_JavaScript最佳实践1

    JavaScript最佳实践是优化网页中JavaScript使用的一套通用方法,旨在提高代码质量、可维护性和兼容性。遵循这些实践,开发者可以构建出更加健壮、高效且易于理解的代码。 一、分离关注点(行为层与结构/内容和表现...

    WEB应用前端优化技术与手段策略

    - **避免复杂计算**:避免CSS表达式和滤镜,减少浮动布局的使用,慎用Web字体,减少过多的font-size声明,简化选择符。 - **提高渲染效率**:值为0时无需单位,使用classList替代className以减少DOM操作。 3. **...

    有关web效率,有著名的14条规则

    避免使用CSS表达式(Avoid CSS Expressions) - **解释**:CSS表达式虽然方便,但会导致浏览器在每次重绘页面时重新计算表达式,消耗大量CPU资源。 - **替代方案**:使用JavaScript或其他更高效的方法来动态更新...

    HTML 提高页面加载速度的方法

    - CSS表达式可能在每次页面计算样式时都重新计算,消耗资源较多。使用高效的CSS选择器可以减少计算的复杂性,提高页面渲染效率。 8. 使用外链的CSS和JavaScript - 使用外部链接的CSS和JavaScript文件,可以让...

    提高PHP编程效率的53个要点

    使用绝对路径而非相对路径可以加快 `include` 或 `require` 的执行速度。这是因为 PHP 会先搜索 `include_path` 中的路径,再查找系统路径,因此使用绝对路径可以避免不必要的搜索过程。 #### 9. 使用`$_SERVER['...

    IIS 网站服务器性能优化指南

    7. **避免CSS表达式**:CSS表达式可能导致频繁计算,影响性能,应尽量避免使用。 8. **使用外部的JavaScript和CSS**:外部引用的JS和CSS文件可被浏览器缓存,减少加载时间。 9. **减少DNS查询**:限制页面内不同...

    前端性能优化建议

    2. 避免使用CSS表达式:CSS表达式执行成本高,应尽量避免。 3. 移除无用的CSS规则:清理无用的CSS规则,减小文件体积。 4. 正确使用display属性:display属性的不同设置会对页面渲染产生不同的影响。 5. 避免滥用...

    zhenaispider优化

    如果数据结构复杂,可以考虑使用CSS选择器或XPath表达式进行定位。 5. **异常处理**:完善异常处理机制,避免因个别页面问题导致整个爬虫进程中断。可以使用try-except-finally结构捕获并处理可能出现的异常。 6. ...

    网页制作网页特效源代码

    - **代码压缩**:压缩JavaScript和CSS文件,减小文件体积,加快加载速度。 - **图像优化**:对图片进行压缩处理,使用适当的格式(如WebP)。 综上所述,网页制作与网页特效涉及多个方面的技术和知识,不仅需要...

    Sams.ASP.NET.4.Unleashed

    - **静态文件压缩**:通过压缩CSS、JavaScript等静态文件,减小传输量,加快页面加载速度。 #### 6. 并发与异步编程 - **任务并行库(TPL)**:利用.NET Framework 4.0中的Task Parallel Library进行多线程编程,...

    Nginx服务器中的GZip配置参数详解

    Nginx服务器中的GZip配置是一项重要的性能优化技术,它能够显著减小网站传输的数据量,从而加快网页加载速度,提升用户体验。GZip通过压缩HTTP响应中的文本内容,如HTML、CSS、JavaScript等,使页面内容在传输过程中...

    vue-cli webpack2项目打包优化分享

    这两个插件用于预先打包常见的第三方库,创建一个动态链接库(DLL),这样在主应用构建时可以避免重复处理这些库,加快构建速度。DLL 包含一个 manifest 文件,记录了库的依赖关系,方便主应用引用。 6. **其他...

    presearchBot

    - 考虑性能优化,如使用并行处理加快抓取速度,但要注意服务器和网络资源的消耗。 通过理解JavaScript的网络请求和HTML解析机制,以及适当的项目组织和最佳实践,我们可以构建一个高效、灵活且符合规范的...

Global site tag (gtag.js) - Google Analytics