京喜（原京东拼购）项目，作为京东战略级业务，拥有千万级别的流量入口。为了保障线上业务的稳定运行，每月例行开展前端容灾演习，主要包含小程序及 H5 版本，要求各页面各模块在异常情况下进行适当的降级处理，不能出现空窗、样式错乱、不合理的错误提示等体验问题。 原来的容灾演习过程：小程…

前一段时间我把webpack源码大概读了一遍，webpack 到4.x版本后，其源码已经比较庞大，对各种开发场景进行了高度抽象，阅读成本也愈发昂贵。 过度分析源码对于大家并没有太大的帮助。本文主要是想通过分析webpack的构建流程以及实现一个简单的webpack来让大家对we…

这是一份来自未来的文档，感谢你对前端技术领域持续关注。读完本文你将知道 2022 年前端人都在关注些什么？

最近好奇主流视频网站的播放器似乎不是我们习惯的video标签加上src属性上一个mp4的url，基本清一色的以blob:开头的一个纯前端的地址，鉴于此对前端的一些流媒体播放做了一些调研，写了这篇文章

在进行多页面开发的时候，项目刚开始阶段，页面较少，编译速度还能忍受，但是一旦页面增加，多次热更新就造成了内存溢出。 可以看到的是webpack把所有的页面都进行了编译，总体积已经达到了18M，耗时超过1分钟，在热更新的时候这个体积会变得更大，从而占据node的运行内存，导致内存…

随着项目不断发展壮大，组件数量开始变得越来越多，项目也开始变得庞大，webpack 编译的时间也会越来越久，我们现在的项目编译一次在 40s ——70s 之间，这是一个效率非常低下的操作。优化的手段有很多，之前项目原本已经做了很多，本文从缓存的角度进行优化讲解 babel-lo…

随着发展，活动会场页面的题图运营需要线上模板化，而自研的导购素材制作平台接入了海棠-创意中心，通过平台能力，将素材模板化，并且通过配置化的方式生成多种场景化，个性化的素材。但是创意中心的素材模板是基于SVG的，而会场页面的题图基本是基于Photoshop(PS)输出，源文件是P…

作为前端工程师，日常开发离不开 psd 文件。 但是日常开发的一个小弹窗页面，它的 psd 居然需要 30+Mb，所以经常得定期清理 psd... 对于我一个 PS 小菜鸡来说，用 PSD 无非只是需要用来度量元素大小（元素间距），查看属性等简单的功能。 相对比于 sketch…

最近在做一个h5 工厂的项目， 就是快速生产 h5，脱离程序员，让运营人员也能配置 h5页面。目前在做psd导入功能。 废话不多说，先搭一个node npm环境。 因为之后还要扩展接口，所以这个node服务用个框架比较好。