程序设计实验室
·
前端邪修：不用Vite也不用Webpack，把React拖回HTML时代的反工程化实践 - 程序设计实验室
内容提要
作者分享了“前端邪修”的开发实践，通过简单的HTML引入React，避免复杂工具链，降低心智负担。使用gulp和babel处理JSX，构建轻量级应用，适合简单交互需求，强调在需求简单时可拆解工程化。
关键要点
-
作者分享了“前端邪修”的开发实践，强调降低心智负担。
-
选择不使用现代工具，如Vite和Webpack，直接在HTML中引入React。
-
第一阶段使用原始React用法，优点是心智负担低，但缺点是依赖体积大和编译慢。
-
第二阶段使用gulp和babel处理JSX，构建轻量级应用，避免复杂工具链。
-
最终产物是一个简单的HTML文件，所有依赖显式，浏览器缓存可控。
-
方案的出发点是仅使用React的表达能力，而不引入完整的工程化体系。
-
该方案解决了在不增加工程复杂度的情况下，获得舒适的交互层。
-
追求复杂度与需求规模的匹配，适合简单需求的项目。
-
放弃了一些现代开发特性，如HMR和TypeScript，全力简化开发过程。
-
作者认为反工程化的尝试在AI时代是有趣的。
延伸解读
反工程化的实践意义
作者通过反工程化的方式，展示了在简单需求下如何有效降低开发复杂度。这种方法适合小型项目，能够快速实现功能，避免了现代工具链带来的心智负担。对于初学者或小团队来说，这种方式提供了一种新的思路，强调了在特定场景下简化开发流程的重要性。
工具选择的权衡
在选择工具时，作者放弃了现代化的构建工具，转而使用gulp和babel。这种选择虽然在某些方面显得复古，但在特定需求下却能提供更高的可控性和稳定性。读者在选择工具时应考虑项目的规模和复杂度，避免不必要的技术负担。
适用场景与限制
这种“前端邪修”方案适合于需求简单、交互不复杂的项目，如内部工具或小型管理系统。然而，随着项目复杂度的增加，放弃现代开发特性可能会导致维护困难。因此，开发者需要根据项目需求谨慎评估是否采用这种简化方案。
延伸问答
什么是前端邪修的开发实践？
前端邪修是一种反工程化的开发实践，通过简单的HTML引入React，避免复杂工具链，降低心智负担。
为什么选择不使用Vite和Webpack？
选择不使用Vite和Webpack是为了降低工程复杂度，直接在HTML中引入React，适合简单需求的项目。
前端邪修的第一阶段和第二阶段有什么区别？
第一阶段使用原始React用法，心智负担低但依赖体积大；第二阶段使用gulp和babel处理JSX，构建轻量级应用，避免复杂工具链。
前端邪修方案的最终产物是什么样的？
最终产物是一个简单的HTML文件，所有依赖显式，只有一个JS bundle，便于浏览器缓存控制。
前端邪修方案适合什么样的项目？
该方案适合需求简单的项目，如Admin系统、AI控制台和内部工具，能够有效管理状态和交互逻辑。
反工程化的尝试在AI时代有什么意义？
反工程化的尝试在AI时代有趣，因为它挑战了传统的工程化思维，追求复杂度与需求规模的匹配。
