
性能优化
文章平均质量分 51
web网站性能优化
山西仓江科技有限公司
这个作者很懒,什么都没留下…
展开
-
缓存代理 在项目中处理表格数据 ( 废话不多说 直接上代码 )
原创 2018-08-07 09:34:51 · 379 阅读 · 0 评论 -
写一个模块按需加载的babel插件 解决项目全量引入第三方资源的问题
babel-plugin-empty-importbabel 简单的理解他是一个语法转换器Babel 的三个主要处理步骤分别是: 解析(parse),转换(transform),生成(generate)Babel 项目是作为一个 monorepo 来进行管理的,它由无数 npm 包组成 其中babel-core为其核心库babel 解析代码的过程大致为1,对输入的源代码字符串...原创 2018-11-06 17:33:44 · 2251 阅读 · 0 评论 -
web应用性能优化之 nginx + compression-webpack-plugin
当我们的项目越来越庞大是时候 会发现 即使做了code split 代码压缩 动态加载 等等一系列优化之后 页面的响应速度依旧很慢这个时候时候可以使用compression-webpack-plugin 这个插件new CompressionWebpackPlugin({ //gzip 压缩 filename: '[path].gz[query]', t...原创 2018-12-19 17:16:27 · 3700 阅读 · 0 评论 -
浏览器缓存
缓存的作用减少了冗余数据的传输,节省了网费。减少了服务器的负担,提高网站的性能缓存分为强制缓存和协商缓存强缓存如果生效不需要再和服务器发生交互,对比缓存不管生不生效都需要与服务端发生交互两类缓存可以同时存在,强缓存的优先级高于对比缓存1.对比缓存(协商缓存)通过最后修改时间来判断缓存是否可用(Last-Modified):/** * 1.第一次访问服务器的时候,服...原创 2019-03-09 15:32:06 · 343 阅读 · 0 评论 -
在 CSS 动画中使用硬件加速
近些年,我们总是听到硬件加速,以及它如何帮助我们提升网页的动画性能,让网页动画变得更好,在移动端更流畅。但是我想一大部分经验少的工程师是不知道硬件加速是如何工作的以及我们如何使用它来帮助我们让动画变得更流畅。在GPU渲染元素并不是所有的CSS属性变化都会直接在GPU处理。只有下面的属性会这样处理:transformopacityfilter因此为了页面更加流畅,高性能的动画,我们需...原创 2019-05-19 02:35:05 · 1180 阅读 · 0 评论 -
Chrome DevTools 代码覆盖率功能详解
Chrome DevTools 中又一个功能查看我们的代码的覆盖率打开姿势1打开调试面板 用快捷键 shift+command+P (mac)输入 show Coverage调出相应面板2 .点击relaod 按钮开始检测3 点击相应文件即可查看具体的覆盖情况(绿色的为用到的代码,红色表示无用代码)查看了当下各大网站的覆盖率普遍存在无用代码的问题 二而且网上给出的所谓treesh...原创 2019-07-06 14:50:18 · 2952 阅读 · 0 评论