type
status
date
slug
summary
tags
category
icon
password
本文详细介绍如何从代码层面彻底移除NotionNext的Clerk验证模块及个人中心部分相关页面，精简项目依赖和Next.JS生成的Javascript文件大小，显著提升博客在国内的加载速度和访问体验。
📝 为什么要移除Clerk和个人中心
原因一
我的NotionNext是采用
yarn export方式静态部署在Vercel，也就是整体的博客是静态网页模式，所以并不需要个人中心以及Clerk之类的动态相关功能。同时我的博客也仅仅是一个对外信息交流的单向输出窗口，很传统的一种RSS博客，并不是一个UGC或者需要进行私域运营的网站，个人中心一类的功能对于我的博客来说没有任何的意义。原因二
在引入Clerk包后，Next.JS生成的_app.js文件过大，且相当一部分代码是完全用不上的部分，影响博客的加载速度，尤其是博客在使用Cloudflare的CDN时，即使使用了SaaS回源方案，LCP和FCP的延迟还是相对较长，国内访问体验并不好。在之前已经进行过NotionNext优化的前提下（用Cursor帮我优化NotionNext博客SEO | Deep Router），Pagespeed Insights所提供的数据显示依旧有很大的优化空间，且指向的就是Clerk
📝 Clerk及个人中心相关功能移除指南
Clerk及个人中心所涉及的功能包括：登录、注册、管理面板这三个。主要步骤如下：
移除Clerk依赖
从
package.json中删除@clerk/localizations和@clerk/nextjs依赖项。涉及文件
package.json，大约在51行左右，移除如下代码部分：移除中间件部分的Clerk认证逻辑
涉及文件
middleware.js ，移除clerkMiddleware导入，将authMiddleware替换为noAuthMiddleware，移除所有Clerk相关的路由保护逻辑。修改后文件为：删除Clerk相关全局声明变量
涉及文件为
lib/global.js ，移除useUserhook的使用，并将 isLoaded, isSignedIn, user状态设置为默认值 (false)，以及移除Clerk相关的条件判断。涉及代码部分为：
移除登录验证相关
行数
40行至45行移除登录验证相关GlobalContext.Provider value
行数
146行-148行删除账户验证相关页面及API
涉及文件包括：
🤗 优化效果
优化前：
优化后：
中间件部分体积缩小接近50%
📎 参考文章
有关NotionNext安装或者使用上的问题，欢迎您在底部评论区留言，一起交流~
版权声明：本博客所有文章除特别声明外，均采用 CC BY-NC-SA 4.0 许可协议。转载请注明出处！