雅虎14条Web性能优化规则

简介: 雅虎军规总结了14条前端性能优化核心原则,涵盖减少HTTP请求、使用CDN、缓存策略、压缩资源、优化CSS/JS加载位置等内容,全面提升网页加载速度与用户体验。
  1. 雅虎军规
    1.1 14条雅虎军规
    1
    减少Http请求
    2
    使用CDN(内容分发网络)
    3
    添加Exprire/Cache-Control头
    4
    使用Gzip压缩
    5
    将Css放在页面的最上面
    6
    将script放在页面的最下面
    7
    经量避免使用Css Expressions(CSS表达式)
    8
    将脚本文件和样式文件都放在外部文件中
    9
    减少DNS查找
    10
    最小化JavaScript和Css
    11
    避免重定向
    12
    移除重复的脚本
    13
    配置实体标签ETag
    14
    使用Ajax缓存
    1.2 性能优化概况

    网络部分

    尽量减少HTTP请求数

    合并文件

    雪碧图

    小图Base64

    减少DNS查找

    开启DNS预解析

    使用CND静态资源服务器

    避免重定向

    杜绝404

    缓存

    配置ETags

    实体标签(ETags),是服务器和浏览器用来决定浏览器缓存中组件与源服务器中的组件是否匹配的一种机制

    添上Expires或者Cache-Control HTTP头

    使用外链的方式引入JS和CSS(缓存)

    内容部分

    按需加载组件

    预加载组件

    减少DOM元素的数量

    尽量少用iframe

    压缩JavaScript和CSS(代码层面)

    CSS 部分

    避免使用CSS表达式

    选择而不是@import

    避免使用滤镜

    把样式表放在顶部

    JS 部分

    把脚本放在底部

    去除重复脚本

    减少DOM访问

    图片部分

    选用合适的图片格式

    雪碧图中间少留空白

    不要用HTML缩放图片,要小图就去加载小图

    用小的可缓存的favicon.ico

    cookie

    给cookie减肥

    清除不必要的cookie

    cookie尽可能小

    设置好合适的域

    合适的有效期

    把静态资源放在不含cookie的域下

    当浏览器发送对静态图像的请求时,cookie也会一起发送,而服务器根本不需要这些cookie。

    移动端

    保证所有组件都小于25K

    把组件打包到一个复合文档里

    服务器

    开启Gzip等压缩

    避免图片src属性为空(为空浏览器也会向服务器发送另一个请求)

    对Ajax用GET请求

    尽早清空缓冲区

    使用CDN(内容分发网络)

    内容分发网络(CDN)是一组分散在不同地理位置的web服务器,用来给用户更高效地发送内容。
相关文章
|
前端开发 JavaScript 容器
|
7月前
|
机器学习/深度学习 算法 搜索推荐
第二章 基础算法
本文系统介绍了加密算法与排序算法的核心知识。涵盖对称加密(如AES、SM4)、非对称加密(如RSA、SM2)、哈希摘要(如SHA-2、SM3)、电子签名及密码存储方案;深入解析冒泡、选择、插入、快排、归并、堆排序等算法的原理、复杂度与优化策略,并对比其稳定性与适用场景;同时涉及字符串反转、正则匹配应用及二分查找、回溯算法等典型算法实践,内容全面,理论结合实际,适用于技术学习与面试准备。
448 0
|
5月前
|
传感器 数据采集 人工智能
数字孪生项目开发的流程
数字孪生不仅是3D可视化,更是融合IoT数据、物理仿真与业务逻辑的系统工程。涵盖需求定义、数据采集、建模渲染、双向映射、AI仿真到集成部署六大阶段,支撑智慧工厂、城市等场景的实时监控与智能决策。(239字)
|
安全 Android开发 Kotlin
Android经典面试题之Kotlin延迟初始化的by lazy和lateinit有什么区别?
**Kotlin中的`by lazy`和`lateinit`都是延迟初始化技术。`by lazy`用于只读属性,线程安全,首次访问时初始化;`lateinit`用于可变属性,需手动初始化,非线程安全。`by lazy`支持线程安全模式选择,而`lateinit`适用于构造函数后初始化。选择依赖于属性特性和使用场景。**
1063 5
Android经典面试题之Kotlin延迟初始化的by lazy和lateinit有什么区别?
|
C语言
###51单片机学习-----如何通过C语言运用延时函数设计LED流水灯
###51单片机学习-----如何通过C语言运用延时函数设计LED流水灯
801 0
|
弹性计算 运维 数据可视化
阿里云轻量应用服务器怎么用?使用教程来了
阿里云轻量应用服务器使用教程,包括轻量服务器远程连接方法、轻量服务器防火墙开放端口教程及轻量应用服务器更换操作系统方法等
2628 0
阿里云轻量应用服务器怎么用?使用教程来了
|
存储 SQL 缓存
大数据基本概念与应用场景
大数据基本概念与应用场景
|
安全 算法 大数据
对称加密加密原理和开发场景解析
加密是自古以来人们都在不断使用的技术,目的是为了隐藏信息,只是随着时代在不断的变化,加密也在不断的更新。从古代的藏宝图对藏宝地点进行隐藏。到二战时候,破译敌方电台,都是属于加密和破解的过程。进入21世纪后,加密在互联网时代也有了新的加密方法。也创造了密码学这个学科。目前在加密的场景下,通常分为:可逆加密和不可逆加密。而在可逆加密场景里又分为:对称加密和非对称加密。本次主要讨论集中在可逆加密上。可逆加密顾名思义就是在对明文进行加密后生成密文,能够通过解密把密文再还原成明文。数据加密一般主要解决三个问题:可信问题(非对称加密可解决),防篡改问题(不可逆加密解决),防窃听问题...
947 0
|
Java API Android开发
快来学习 Compose 中的 “ViewPager” 吧
学习 Compose 中的 “ViewPager”
1144 0
快来学习 Compose 中的 “ViewPager” 吧
|
存储 缓存 前端开发
Jetpack 系列(13)—— 食之无味!App Startup 可能比你想象中要简单
Jetpack 系列(13)—— 食之无味!App Startup 可能比你想象中要简单
688 0
Jetpack 系列(13)—— 食之无味!App Startup 可能比你想象中要简单