——本文是对之前同名文章的修正，将所有webpack3的内容更新为webpack4，以及加入了笔者近期在公司工作中学习到的自动化思想，对文章内容作了进一步提升。 作为互联网项目，最重要的便是用户体验。在举国“互联网+”的热潮中，用户至上也已经被大多数企业所接收，特别是在如今移动…

.为什么需要构建工具转换 ES6 语法转换 JSXCSS 前缀补全/预处理器压缩混淆图片压缩...欢迎补充2

网上的面试题一大堆，鱼龙混杂，一方面多数题目质量不高，另一方面有答案的很少，即使拿到面试题对自己的帮助也不大。 最近我花了一些时间，为大家整理了2020年各一、二线互联网公司的前端面试题，内容包括JavaScript、算法、网络&安全、Vue、React等大量的前端知识点和相关…

Ajax 技术的出现，让我们的 Web 应用能够在不刷新的状态下显示不同页面的内容，这就是单页应用。在一个单页应用中，往往只有一个 html 文件，然后根据访问的 url 来匹配对应的路由脚本，动态地渲染页面内容。单页应用在优化了用户体验的同时，也给我们带来了许多问题，例如 S…

无论是在工作中，还是在面试中，web前端性能的优化都是很重要的，那么我们进行优化需要从哪些方面入手呢？本文将遵循yahoo前端性能团队总结的34条黄金定律，哦不，现在是35条了。 1.减少HTTP请求次数。 减少页面的HTTP请求数是个起点，这是提升站点首次访问速度的重要指导原…

WebP 的优势体现在它具有更优的图像数据压缩算法，能带来更小的图片体积，而且拥有肉眼识别无差异的图像质量；同时具备了无损和有损的压缩模式、Alpha 透明以及动画的特性，在 JPEG 和 PNG 上的转化效果都相当优秀、稳定和统一。无损webp相比png减少26%大小。 从4…

Web 页面性能优化，解决了图片相关，问题就解决了大半。本文从 Web 常见的图片格式入手，引出与图片优化相关的有效方案，期望对大家能有一点帮助。 有损压缩：借由将次要的信息数据舍弃，牺牲一些质量来减少数据量、提高压缩比。这个过程是不可逆的。图片常见的有损压缩手段是合并相近的像…

在现今用户就是上帝的年代，互联网竞争如此之大的时代，有针对性的对每个用户的喜好定制不同的内容，按照用户的喜好去决定产品迭代方向已经成为各个互联网公司必须要专注去做的事情，于是埋点便成为了获取信息必不可少的一种方式。那我们埋点有什么目的呢？需要拿到点什么呢？ 这种埋点方式虽然能精…

记得初学Vue源码的时候，在defineReactive、Observer、Dep、Watcher等等内部设计源码之间跳来跳去，发现再也绕不出来了。Vue发展了很久，很多fix和feature的增加让内部源码越来越庞大，太多的边界情况和优化设计掩盖了原本精简的代码设计，让新手阅…