我们都知道在业务开发的过程中，如果完全不同的组件有相似的功能，这就会产生横切关注点（cross-cutting concerns）问题。 在React中，存在一些最佳实践去处理横切关注点的问题，可以帮助我们更好地进行代码的逻辑复用。 针对这个问题，在使用createReactC…

带你深度解锁Webpack系列(基础篇) 和 带你深度解锁Webpack系列(进阶篇)，主要是讲解了 Webpack 的配置，但是随着项目越来越大，构建速度可能会越来越慢，构建出来的js的体积也越来越大，此时就需要对 Webpack 的配置进行优化。 本文罗列出了十多种优化方式…

本篇所有代码线上代码react-webpack4-cook,翻译过来叫：webpack4和react的乱炖，可以跟着代码进行配置，之前有很多坑，线上代码都已经被解决了 。如果对您有帮助，不妨给个star.点赞关注不迷路 一篇文章不写前言总感觉不太正式，大概介绍下我是怎么完成一个…

最近打算改进一下现有网站的架构，微前端这个词多次进入了我的视野。 但是网上关于微前端文章总是说得似是而非，于是我找到这篇文章进行翻译。并大概理解微前端的理念。目前还没有确定是否使用微前端架构，因为看起来业界对最佳实践并没有达成一致。 译文开始，有删节。 把前端做好很难，让多个团…

React的虚拟DOM和Diff算法是React的非常重要的核心特性，这部分源码也非常复杂，理解这部分知识的原理对更深入的掌握React是非常必要的。 本来想将虚拟DOM和Diff算法放到一篇文章，写完虚拟DOM发现文章已经很长了，所以本篇只分析虚拟DOM。 本篇文章从源码出发…

PWA 俨然成了当下的香饽饽。你还在门外徘徊？你还在观望？你还不知道如何下手？来，从构建一个 simple app 开始，了解测试、service worker、代码托管的相关内容，熟悉 PWA 开发流程。下一个大师就是你！

聊聊大型项目

上文使用 HtmlWebpackPlugin 生成了一个 index.html 文件，并且插件自动把打包后的资源添加到 index.html 文件中，使我们可以打开 index.html 在浏览器看到 js 的执行效果。本节我们将用 Webpack Loaders 来处理工作中…

rem 的官方定义『The font size of the root element.』，即以根节点的字体大小作为基准值进行长度计算。一般认为网页中的根节点是 html 元素，所以采用的方式也是通过设置 html 元素的 font-size 来做屏幕适配，但实际情况真有这么简单吗？