最近在做一个 H5 营销活动时，遇到了一个比较头疼的问题：页面要用到 7 种字体，原始`ttf`文件体积加起来 42MB，就算换成压缩率较高的`woff2`格式也需 20MB 左右

如何通过和 APP 的配合大幅提升 H5 页面的首屏加载速度，如何构建一套秒开系统，让 H5 拥有类似小程序的性能体验。通过接口预请求让APP打开H5的同时并行请求数据，消灭H5请求数据的耗时。

此文研究页面中的图片资源的加载和渲染时机，使得我们能更好的管理图片资源，避免不必要的流量和提高用户体验。 要研究图片资源的加载和渲染，我们先要了解浏览器的工作原理。以Webkit引擎的工作流程为例： 从上图可看出，浏览器加载一个HTML页面后进行如下操作： 解析HTML —> …

前段时间，我们前端组做了一些系统优化。集中表现在代码执行速度，系统安全等方面，故新建一篇文章来记录这次优化的经历。如果本文对您有帮助，烦请大家一键三连哦, 蟹蟹大家~

前置基本知识 vuedevtool功能简介 安装 安装过程就不再赘述，可以参考官方的文档 ，官网上也描述了devtools不生效的场景。 概览 左侧4个tab components(组件的详细信息)

通常移动端图片上传的时候都会限制在2M以内，但是随着移动设备拍照像素的提高，基本图片都会大于2M，本文基于canvas实现图片指定大小缩放比例压缩

前端优化，这是一个很大的范围。可能平时更多的文章是基于某一点去深入的讲解。所以趁机整理一套前端优化的基础大纲，一方面给让自己沉淀下这些知识，另一方面也方便后续优化时有个清单可以去对照着优化。

ZoomUI 的 Table 组件相比 ElementUI 的 Table 组件在更新渲染方面性能提升了十倍，这是如何做到的呢？

使用 webpack 插件 DllPlugin 和 DllReferencePlugin ，是前端工程化中优化打包速度的重要途径。webpack中文网-DllPlugin。 他们可以打包常用的且不经常更新的模块，生成 JS 和 json文件，一般放入 public 目录中；项目…