当前位置:首页 » 云服务器 » 直出服务器怎么样

直出服务器怎么样

发布时间: 2024-10-07 15:41:36

① web前端有哪些性能优

一,关键资源字节数

字节数也就是我通常说的减少资源文件(js,css,image,video...)的大小

1,压缩

  • 前端使用uglify混淆压缩

  • 后端开启gzip

  • 对图片进行压缩,使用压缩比例更高的格式(webP)

  • 2,缓存

  • 强缓存(http状态码:200),不用请求服务器直接使用本地缓存

  • 协商缓存(http状态码:304),使用时先请求服务器若被告知缓存没过期则使用本地缓存,不用下载资源

  • 使用localstorage对数据进行存储

  • 3,针对首屏优化

    对非关键资源延迟加载、异步加载,减少首屏资源大小

    二,关键资源连接数

    1,合并请求

  • 使用http2.0的多路复用合并请求

  • 配置combo,在无法使用http2.0的情况下作为一种合并资源请求的手段

  • 2,减少图片请求数

  • 使用spite图

  • 使用svg-symbol

  • 3,针对一些场景采用css、js内联的方式

    4,使用强缓存减少了一次服务器请求

    5,非关键资源延迟、异步加载,减少了首屏资源连接数

    三,关键渲染路径

    网上有张关于页面渲染路径的图,这里我就不放了,大家有兴趣自己网络下

    1,bigpipe分块输出

    这里主要是因为要完成一整个页面的输出后端需要处理很多个任务,我们可以将这些多个任务进行分块,谁先完成谁就先输出,最终通过JS回填的方式输出DOM节点。这种方式主要解决了直出页面阻塞的问题

    2,bigrender分块渲染

    常规的手段就是采用前端模板渲染页面,针对首屏时间主要减少了首次构建DOM树时的节点数

    3,针对reflow,repaint,composit路径处理

    4,涉及到动画时关于layer的概念render layer、graphics layer

    5,css放在头部、js放底部避免阻塞DOM树的构建,

    关于css、js的位置对于页面渲染的影响大家可以关注下相关的文章。
    核心:css资源不会阻塞DOM树的构建但会阻塞DOM的渲染,JS会阻塞DOM树的构建,CSS会阻塞JS的执行



热点内容
低温存储测试 发布:2025-03-14 12:10:22 浏览:244
c语言二维数组的输出 发布:2025-03-14 11:58:10 浏览:25
安卓脚本自动运行 发布:2025-03-14 11:49:35 浏览:354
yii页面缓存 发布:2025-03-14 11:45:51 浏览:798
c语言算法书 发布:2025-03-14 11:45:26 浏览:264
安卓动漫插件在哪里 发布:2025-03-14 11:41:11 浏览:660
linux复制系统文件到 发布:2025-03-14 11:29:45 浏览:40
腰2椎体压缩性骨折多久能干活 发布:2025-03-14 11:29:34 浏览:168
脚本挖图全自动 发布:2025-03-14 11:28:51 浏览:77
redis缓存有效期 发布:2025-03-14 11:28:45 浏览:739