开个小坑，记录自己学习React源码过程中的一些心得。感觉市面上讲解React源码的书籍、视频都讲的一般，颇有照本宣科的意思。我希望能用通俗的话，把自己对React的理解记录下来。一方面是自己遗忘了之后，能回来看看，另一方面也是希望帮助到其他希望了解React源码，却又摸不着门道的人 第一篇我们首先来讲一讲Fiber架构。所谓Fiber架构，是React16开始的新架构。说到虚拟DOM，相信大

仓库链接：本篇代码 运行方法参考readme，请使用pnpm，因为本次使用的rspack尚未推出1.0版本，预计后续可能会有很多breakchange，所以lock文件至关重要，而我只上传了pnpm的lock，非常抱歉。 环境：node 20.12.0 pnpm 8.15.5 其余依赖以lock文件为准 上一篇，我们已经完成了服务端的部分。理论上，我们这期只要补完浏览器端水合的功能，就基本完

关于ssr相关的介绍，可以移步之前的一篇博文，本文不再赘述 日常工作中，我们可能都接触过ssr，不过我们可能通常是借助于框架（例如Next.js）的支持来完成ssr。今天我想尝试，摆脱高度封装的前端框架，只依赖react相关的库，来实现ssr。 本篇代码 pnpm i安装依赖，npm run server启动服务 环境：node 20.12.0 react和react-dom版本均为18.3.1

前两天看到ByteFE公众号发了篇文章，从源码去讲webpack。我之前也从很多方面去学习webpack，只是源码一直没太看得进去，这一次我想仔细地读一读。 简要介绍tapable说实话，之前看webpack源码一直没看的太懂，看不进去，有一部分原因就是它的hooks我根本看不懂是在干什么。比如这样，一堆hooks，还有全是回调函数，看不进去 123456789101112131415con

最近在补js基础。当初自学js的时候，总是感觉学的不扎实。只能说不去上手，再怎么死读书，也理解不了。积累了经验，然后自己去思考，这个时候再去看理论，就容易理解了。 感觉工作一年以来，确实学到了很多，但是过于专注于应用方面的知识，反倒基础上有些东西忘记了。虽说平时写代码多半没什么影响，但是基础扎实，才能让你知其所以然。搞技术的永远不能放弃对“知其所以然”的追求。 本篇文章小目标是当一个自己的笔记，

开个坑，主要也是怕自己后面忘了 简单写写，有空了补上 __webpack_modules是一个数组，每个元素都是一个函数，函数接受三个参数：第一个参数module好像没用到，第二个是一个对象（会把本模块要导出的属性，赋值给这个对象），第三个是__webpack_require方法（用于引入其他的模块）。函数体里面就是原本这个模块的代码，然后会通过__webpack_require.d方法（类似ob

为什么需要动态加载上一篇讲我写webpack针对markdown的loader的时候，提到了希望能动态加载以优化性能。篇幅原因没有展开说，打算单独写一篇文章讲一下。 当我们访问网站的时候，浏览器会向服务器请求页面资源。首先请求的当然是html文件。html文件里会带很多script标签，浏览器解析到这些标签的话，就会去下载这些js资源。当然有些script标签带了async或者defer属性，不会

因为觉得hexo框架搭的博客功能一般，就有了想要自己写一个博客的想法。然后就想着如果把markdown文件也放到项目里的话，会比较方便，发现需要编写一个加载markdown的loader，于是就有了这篇博客，来记录一下踩过的坑和收获 loader的作用我们都知道，直接在代码里面通过require或者import去引入markdown文件是会报错的，因为webpack在打包的时候不知道如何去处理

开始前的碎碎念 最近加班真的很严重，组里同事们都已经苦不堪言。业务交付压力非常大，根本没时间去磨练本领，学习技术。真的很讨厌这种没有成长的日子，每天被业务需求赶着跑。每天下班之后，本来应该用于提升自我的时间也被压榨用来写业务代码。 希望组里能早日摆脱现状，不然就只能润了 很多人应该都听过http缓存，也是比较常问的面试题吧。还记得我当时什么也不会，刷面经的时候就看到什么http状态码里的304

遇到了invalid hook call报错上周，业务下游的同事反馈了一个生产问题，说我们传的值有问题，领导让我帮忙排查一下。我最近一直没做那个项目相关的需求，打开那个项目切到release分支，拉代码，npm i然后启动，结果就白屏了。。。 打开控制台，看到了invalid hook call的报错，发生在公共组提供的一个组件里面。这个报错其实还有点讲究，我们都知道react的hook因为实现方