IT数码 购物 网址 头条 软件 日历 阅读 图书馆
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
图片批量下载器
↓批量下载图片,美女图库↓
图片自动播放器
↓图片自动播放器↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁
 
   -> JavaScript知识库 -> 浏览器性能优化(19种) -> 正文阅读

[JavaScript知识库]浏览器性能优化(19种)

主要是三大点:

①减少对HTTP的请求次数和大小

②代码的优化

③dns及HTTP通信方式

举例说明:

1.js中减少闭包的使用(原因:闭包会产生不是放的栈内存)
a:循环给元素做事件绑定的时候,尽可能的把后期需要的信息(列如索引)
储存到元素的自定义属性上,而不是创建闭包储存
b.可以在最外层形成一个闭包,把一些后续需要的公共信息进行存储,而不是每一个发发都创建闭包(例如单例模式)
c.尽可能的手动释放不被站用的内存

2.尽量减少css和js文件(把需要引入的css合并成一个,js也是合并成一个),原理是在减少http请求次数,尽可能的把合并后的代码进行压缩,
减少http请求资源的大小
a:webpack这种构建工具
b:在移动开发(或者要求高性能的pc开发),如果js和css不多的,我们可以写内嵌式
3.尽量用矢量图或者svg图标代替传统的png等格式的图片
4.减少对DOM的操作(主要是减少DOM的重绘和回流(重排))
a:关于重排的分离读写
b:使用文档碎片或支付窜拼接做支付窜绑定
5.在js中避免“嵌套循环”(这种会额外郑家很多次循环次数)和“死循环”
6.采用图片的懒加载(延迟加载),目的是减少页面第一次加载过程中http的请求次数
7.利用浏览器和服务器的缓存技术(304缓存),把一些不经常更新的静态资源做缓存处理(css、js、静态图片等都可以做缓存) 原理也是为了减少http请求大小
8.尽可能使用事件委托(事件代理)来处理事件绑定的操作,减少DOM的频繁操作,其中包括每一个DOM元素做事件绑定
9.减少使用css表达式(expression)
10.尽可能减少对标签选择器的使用(css选择器的解析是从右往左解析)
11.css雪碧图技术(css sprite/css 图片精灵) 把所有较小的图片汇总到一张大图上,用定位的方式展示到对应小图标即可
12.减少cookie的使用(主要是减少本地cookie存储内容大小)
13.页面中的数据获取采用异步编程和延迟分批加载
14.页面中出现视频音频标签,我们不让页面加载的时候就去加载这些资源(要不然加载会变慢)(只需要设置preload="none"即可)等页面加载完成,音频播放的时候我们再加载资源
15.在客户端和服务端交互的时候,对于多项数据我们尽可能基于json格式来进行传送(json格式的数据处理方便,资源偏小) ?相对于xml格式的传输才会有这个优势
16.尽可能实现js的封装(低耦合高内聚),见晒页面中的冗余代码(减少HTTP请求资源的大小)
17.在css导入的时候尽量减少使用@import导入式,因为@import是同步操作,而link是异步操作
18.使用window.requestAnimationFrame(js中的帧动画)代替传统的定时器动画
19.减少递归的使用,避免死递归,避免由于递归函数到制的栈内存嵌套(建议使用尾递归)

  JavaScript知识库 最新文章
ES6的相关知识点
react 函数式组件 & react其他一些总结
Vue基础超详细
前端JS也可以连点成线(Vue中运用 AntVG6)
Vue事件处理的基本使用
Vue后台项目的记录 (一)
前后端分离vue跨域,devServer配置proxy代理
TypeScript
初识vuex
vue项目安装包指令收集
上一篇文章      下一篇文章      查看所有文章
加:2022-02-19 01:03:52  更:2022-02-19 01:04:21 
 
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁

360图书馆 购物 三丰科技 阅读网 日历 万年历 2024年11日历 -2024/11/24 11:02:31-

图片自动播放器
↓图片自动播放器↓
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
图片批量下载器
↓批量下载图片,美女图库↓
  网站联系: qq:121756557 email:121756557@qq.com  IT数码