
Next.js 实现原理系列
文章平均质量分 94
以问题为驱动,阅读 Next.js 源码,掌握 Next.js 实现原理。
倪琛
程序员
展开
-
Next.js 实现原理系列(3):页面渲染
目录背景切换 Page 时,为什么页面上不变的部分也会被重新渲染?源码片段:doRenderReact 的 diff 算法背景这是 Next.js 实现原理系列的第 3 篇,承接之前对 Link 和 Router 的讨论,来看看页面渲染的原理。由于 Next.js 的选择,以及 React 的 diff 算法本身,每次切换页面时,页面组件都会被重新渲染。如果想要避免页面上的某个部分重新渲染,就不能把它放到相应的页面组件内,而是放到自定义的 `App` 组件内。原创 2021-12-12 00:29:04 · 2544 阅读 · 4 评论 -
Next.js 实现原理系列(2):页面的 prefetch
目录背景prefetch 的到底是什么?prefetch 功能代码片段 1:Link 中的 prefetch代码片段 2:router 中的 prefetch代码片段 3:page-loader 中的 prefetch代码片段 4:route-loader 中的 prefetch代码片段 5:getFilesForRoute代码片段 6:prefetchViaDom小结背景本文是 Next.js 实现原理系列 的第二篇文章,承接上一篇 Next.js 实现原理系列(1):Link 基础 中“问题驱动”的原创 2021-11-28 16:20:17 · 2210 阅读 · 7 评论 -
Next.js 实现原理系列(1):Link 基础
目录背景热身:a 链接 的 preventDefault代码片段 1:Link代码片段 2:linkClickedLink 下能否不加 a 链接?代码片段 3:Link小结背景这周开始尝试阅读 Next.js 源码,有难度,但也很有意思。对我来说,一个能够极大提高效率的:每次先抛出一个自己感兴趣的小问题(多是关于实现原理的细节),然后阅读源码,尝试回答这个问题。解决疑问之后,再放下源码,抛出下一个感兴趣的问题(很可能是解决了上一个问题所引发的新问题),再阅读源码,如此循环往复。这样的好处是,每次阅原创 2021-11-27 12:32:54 · 2873 阅读 · 2 评论