前端代码优化基本方法

减少HTTP请求

  • HTML优化:

    • 使用语义化标签
    • 减少iframe:iframe是SEO的大忌,iframe有好处也有弊端
    • 避免重定向
  • CSS优化:

    • 布局代码写前面
    • 删除空样式
    • 不滥用浮动,字体,需要加载的网络字体根据网站需求再添加
    • 选择器性能优化
    • 避免使用表达式,避免用id写样式
  • js优化:

    • 压缩
    • 减少重复代码
  • 图片优化:

    • 使用WebP
    • 图片合并,CSS sprite技术

减少DOM操作

  • 缓存已经访问过的元素
  • "离线"更新节点, 再将它们添加到树中
  • 避免使用 JavaScript 输出页面布局–应该是 CSS 的事儿

使用JSON格式来进行数据交换
使用CDN加速
使用HTTP缓存:添加 Expires 或 Cache-Control 信息头
使用DNS预解析

  • 预解析的实现:
用meta信息来告知浏览器, 当前页面要做DNS预解析:
在页面header中使用link标签来强制对DNS预解析: 

你可能感兴趣的:(前端,html,优化,性能优化)