村上春树：如何突破前端开发技术瓶颈-

如何突破前端开发的技术瓶颈

日本作家村上春树写了一本哲学书——《当我谈论跑步时我在谈论什么》。

他在书中表示，跑步和写作一样，都需要毅力和耐力，追求超越； 两者都需要清晰的头脑和毅力。 书中所写之处，没有华丽丽的场面，而是雄辩地讲述着迷茫、失败和挣扎。

这本书名义上是关于跑步的，实际上是作者在个人创作低谷时期不断思考突破的地方。 仔细想想，这种思维对于一个工程师来说也是至关重要的。

在前端领域，入门相对容易，但“更上一层楼”则更加困难。 市场上高级/高级前端工程师很少。 当然，这并不一定是坏事。 一旦突破了瓶颈，在技能上脱颖而出，你就会拥有更广阔的空间。 那么，如何从打牢基础到突破瓶颈呢？

接下来我们就来讨论一下前端工程师在需要进阶的时候应该学习什么。

说到进步，我首先想谈谈我们每个人内心的焦虑和困惑。 面对这种情绪是学习的第一步。 对于每个追求进步的人来说，各个阶段的瓶颈期总会“如期而至”。 早在战国时期，庄子在《烹鼎解牛》中就说过：“吾生亦有有限，而吾知无极。吾有有限，则从无极，如此也！”那些已经成为了知者的人，就是这样！”

但现在，在这个信息爆炸的时代，信息量呈指数级增长，知识似乎触手可及。 那么你应该学什么，怎么学，学完之后做什么呢？ 大多数人在知识面前都会感到焦虑和困惑。

同样，有一定工作经验的工程师也面临不少质疑。

？ 如何避免在类似工作工作5年却没有5年工作经验？

？ 如何从复杂、统一的业务需求中提取并改进技术点？

？ 如何为团队带来更大的价值，体现经验和能力？

这些质疑对于前端工程师来说似乎更加强烈：前端技术的发展备受关注，前端工程师之所以变得更加重要，是因为相关技术的不断进步和迭代。 因此，我们比以往任何时候都更需要主动学习。 但据我观察，目前网上的学习资料往往存在以下两个问题。

？ 过于碎片化，这种知识只能成为一定程度上缓解焦虑的“精神鸦片”。

？ 追求短期见效、专家的经验、“面试题”的快速解答，逐渐演变成了跳槽、加薪的“兴奋剂”。

技术进步是一个系统而曲折的过程。 每个学习者接触到的知识内容及其背后的原理构成了他的思维方式。 短期快速的内容或者大量碎片化的知识很难帮助我们深入思考。 坦白说，我也是这些“学习资料”的收藏者。 如果没有系统的、有针对性的学习和反复刻意的练习，那么结果就是，我以为收集到的是知识，实际上收集到的是“知”； 自以为掌握了知识，其实只是囤积了一堆“知道”。

我想与大家分享我多年来在海外以及在BAT工作所积累的经验。 我也想把自己长期以来收集的“干资料”整理一下，系统地整理输出，和大家一起提高。 于是，《前端开发进阶核心知识：从打牢基础到突破瓶颈》一书诞生了。

爱因斯坦说：“仅仅从别人的智慧中学习是不够的；你需要自己弄清楚。花时间记录、思考并深入思考你所学到的东西。”

海伦·凯勒曾说过：“知识使人进步，智慧使人获得启蒙”。

希望本书不仅详述“知识”，更体现编程的“智慧”，让各位读者朋友共同思考、共同进步。

本书特点

说到这本书的特色，我想在讲这本书的重点的同时，也讲一下前端开发的发展。

前端大发现时代：旧工具淘汰，新势力崛起

记得刚接触前端编程的时候，它风靡一时。 其清新优雅的DOM操作、坚如磐石的兼容性处理、灵活高效的封装和链式调用，让人如沐春风。

当时我天真地认为“这就是巅峰”，但事实是“这只是开始”——随着三大框架的崛起，技术变革就像“暴风雨前的平静”，突然间被其他“先进生产力”所取代“掉队了。所以我们看到各大平台的技术都在“变”，各自引领了发展趋势。

这只是一个类库在前端浪潮中的兴衰。 想想ES()语言规范的演进速度、HTML5的扩展、从Ionic到React的跨端开发框架、CSS从基本布局模型到灵活盒模型再到原生Grid解决方案，以及构建和构建从 Grunt 到 Gulp 的打包工具。 然后到...

本书力求在强调“永恒”语言的基础上，向大家介绍更先进的开发技术。 例如，服务器端渲染、HTTP 3.0、使用Lerna和yarn构建项目、框架的原理和演进、框架与虚拟DOM的比较等。

内在的混乱：克服障碍，勇往直前

前端、CSS、HTML三大方向的背后，是无尽的碎片化场景。 前端是最接近用户的“前台”，它的基因决定了它需要处理多种情况。 同时，无论是跨平台还是语言特性，开发者都感到困惑。

？ 我们应该使用哪些 HTML 标签来实现最佳语义？

？ 如何面对不同终端的怪异问题并保证体验的一致性？

？ 我们应该如何编写代码才能实现无错误？

？ 这用得乱七八糟，指向谁呢？

在本书中，除了理论分析之外，我们还将重点介绍经验介绍和最佳实践。

？ 分析多种场景和行业解决方案的输出。

？ 观察实际打包结果，比较解决方案，分析树的实现细节。

？ 探索如何组织架构代码，提高开发效率。

？ 它没有解释CSRF、XSS等基本概念，而是从认证的角度出发，让读者对安全有一个立体的认识。

光明未来：打铁需艰苦奋斗

当前，我们正在经历所谓的“资本寒冬”。 无论是大厂、二线企业还是创业团队，“优化人员结构”的消息层出不穷。 但据我观察，“高级前端工程师”的招聘需求正在“逆流而上”，水平高、经验丰富的开发者时刻备受追捧。 因此，磨练技能、积累项目经验将是所有前端工程师的核心诉求。

作为作者，我也在思考如何让这本书变得更有价值，真正帮助大家突破瓶颈，让读者感受到“物有所值”，进而实现技能提升。

在本书中，我会穿插大量经典的面试例子，包括我作为BAT面试官考过的“私密题”、我作为面试官遇到的“经典题”以及我讨论过的“经典题”和我的行业前辈们一起。 “开放式问题”。 在日常的开发和学习中，我也阅读了很多高质量的文章，并将我的见解分享给大家。

从开发菜鸟到高级工程师，除了主观能动性之外，我个人认为成长过程中的一大瓶颈就是“不是每个人都有机会接触到好的项目，然后从中提高”。 这里的“好项目”是指“项目重构”、“类库迁移”、“复杂的应用设计”、“较难的bug定位”、“新技术实现”等对开发者基础要求较高的项目和设计能力。

为此，在本书中，我会插入大量关于代码设计模式、函数式表达、源码分析、组件设计与封装、开源库解读、项目代码组织等内容，也一步步指导你步骤回顾，向社区学习从中汲取精华，构建更真实的开发场景，直接解决实践中的高频痛点。

最后，希望与每一位读者保持长期联系，共同讨论问题，共同进步。

本书内容

本书分为8部分，涵盖33个主题（33篇文章）。 现将各部分内容介绍如下。

第1部分 基础强化（01~04）

“而水不够稠，就承载不了大船。” - 基础的重要性不言而喻，前端开发也不例外。 本节介绍该语言的关键基础知识。 由于语言的灵活性，这些基本内容既重要又困难。 这些内容包括：这个指向问题、闭合问题、关键API、高频测试点等等。其实这些内容不仅会决定你的面试表现，还会直接影响你未来的进步和发展。

第二部分 语言进阶（05~08）

扎实的基础知识是进步的基石。 本部分将从异步特性的理论与操作、理解与实现、面向对象与原型知识、ES的发展与演变等入手，带领大家强化难点。 同时，我们会用大量的例子来加深读者对知识点的理解，帮助读者融会贯通。

第三部分：不可忽视的HTML和CSS（09~11）

爬完山后，你可能会觉得学习HTML和CSS比较容易，但关于HTML和CSS的知识仍然是“不可忽视的”。 即使它们不是面试和工作中的“淋浴”，它们也是至关重要的内容。 本节我们不会系统全面的介绍HTML和CSS的相关知识点。 相反，我们会启发式地从一些细节入手，“透过管子看到豹子”，介绍如何学习这些内容，并介绍响应式布局的实现和实现。

第四部分 前端框架（12~18）

本节将介绍前端框架的知识，重点以React为中心来分析框架对于前端意味着什么，以及我们应该如何学习React。 事实上，学习React不能只停留在“会用”的层面。 学习它的组件设计和数据状态管理也非常有利于培养编程思维，帮助学习者从更高的层面看待问题。 同时我们也会对比Vue框架，讨论前端框架的“前世今生”。

第五部分 前端工程（19~22）

高级程序员永远无法逃避的关键任务之一就是“基础建设”和“项目架构建设”。 这部分将从模块化入手，结合Lerna、Lerna等工具，为大家还原一个真实的“基础设施”场景，深入项目组织设计，实现代码规范工具设计。

第六部分 性能优化（23~25）

性能优化是一个理论与实践相结合的重要课题。 本节将介绍大量重要的性能优化知识点，例如性能监控、错误收集和报告等，同时也会结合项目实例和React来讨论性能优化问题。 在阅读这部分之前，你需要了解缓存策略、浏览器渲染特性、异步单线程对性能的影响、网络传输知识等。你还必须有一些实践经验，比如分析火焰图、准确编写和运行等。

第七部分 编程思维与算法（26~30）

前端开发离不开编程基础。 良好的编程思维和基础的算法知识可以说是每个工程师必须具备的。 这部分将用来描述各种设计模式，一步步教你如何处理各种数据结构，加强你对一些常用测试的前端算法的理解和掌握。

第八部分 网络知识（31~33）

这部分将重点加强网络知识，包括缓存、超文本传输​​协议（HTTP）、前端安全等。