移动端性能优化

为什么需要性能优化

1.提升用户体验

2.移动端网络速度慢

3.移动端设备性能低

CSS和js优化

减少资源请求次数,http连接握手是比较耗时的,可使用内联的css样式,可减少http请求的次数。但同时也带来了一些问题

写过的代码无法复用,使得HTML文件变大,加载时间变长。

外部文件引入,增加了HTTP请求次数,但很好的复用代码,有效利用浏览器的静态资源缓存机制,代码分离,利于维护。

样式代码放在html头部,尽快加载。js代码与dom无关可放在页面头部,与dom节点相关一般放在尾部加载。

避免空链接,避免慢标签<table>等,js合并压缩,混淆,后端开启请求缓存。

选择器在不会误选元素的情况的下,尽量保持简单,非必要不推荐使用*等通配符,避免浏览器过度解析降低速度

尽量减少对DOM的操作次数,尽量用id查找,减少层级查找

图片优化

css画小图片,图片压缩处理,使用更高压缩比格式的图片,尽量少用图片,使用图标字体代替图片

合理使用base64内嵌图片,合并静态资源图片,雪碧图

事件优化

事件委托代替事件循环绑定

节流,稀释频繁触发的事件,如scroll,resize mousemove等

 资源加载

资源按需加载,只加载可视屏所必须的

 

posted @   一剑天门  阅读(224)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· 周边上新:园子的第一款马克杯温暖上架
· 分享 3 个 .NET 开源的文件压缩处理库,助力快速实现文件压缩解压功能!
· Ollama——大语言模型本地部署的极速利器
· DeepSeek如何颠覆传统软件测试?测试工程师会被淘汰吗?
· 使用C#创建一个MCP客户端
历史上的今天:
2019-07-26 SpringBoot入门初体验

喜欢请打赏

扫描二维码打赏

了解更多

点击右上角即可分享
微信分享提示