目录
第一部分
- 第一步
- 1 无框架的框架
- 2 您的第一个 Web 组件
- 3 让您的组件可重用
- 4 组件的生命周期
- 5 使用模块构建更好的 Web 应用
第二部分 改进组件工作流程的方法
- 6 管理标记
- 7 使用 HTML 进行内容模板化
- 8 影子 DOM
- 9 Shadow CSS
- 10 Shadow CSS 的挑战
第三部分 整合组件
- 11 真实的 UI 组件
- 12 打包与支持旧版浏览器
- 13 测试组件
- 14 事件与应用数据流
- 15 隐藏复杂性
概述
本·法雷尔的《Web 组件实战》一书致力于原生 Web 组件作为一种独立技术,用于构建可重用的界面元素,而不依赖于流行的 JavaScript 框架。作者循序渐进的展示了现代浏览器技术栈(Custom Elements、Shadow DOM、HTML Templates 和 ES 模块)如何用于构建完整的 Web 应用。
本书第一部分让读者了解 Web 组件的基本原理:创建自定义元素、管理其生命周期、重用性和模块化架构。作者强调,Web 组件并非抽象概念,而是如今在大多数浏览器中可用的实用工具。
第二部分关注组件的内部结构。探讨了管理标记的方法、内容模板化、使用 Shadow DOM 以及 CSS 隔离。专门章节讨论了影子模型的问题与限制,使读者不仅能从积极方面,也能从批判角度看待该技术。
第三部分集中于构建更复杂的解决方案:将组件整合到统一界面中、组织事件和数据流、测试以及支持旧版浏览器。最终,作者一步步实现了真实的用户界面,将内部复杂性隐藏在精心设计的组件背后。
本书具有实践性,其结构使得示例从一章到另一章逐渐复杂并演进,形成完整的架构。这使得它对那些希望深入了解 Web 平台原生能力并有意识地评估 Web 组件作为框架替代或补充的开发者很有帮助。
我的看法
一本关于 Web 组件及其使用的书。考虑到我属于那些认为这条 Web 发展路线有点死胡同且前景不佳的人,因为我从事重视 SEO 优化的项目已有约 10 年,但肯定也有人愿意每隔一个项目就用 Web 组件来构建。所以我以怀疑的态度阅读了这本书,尽管我对不借助 JS 框架更深入了解原生 Web 组件很感兴趣。这本书的一个明确优点是,作者如何在一章又一章中不断完善他的成果,并最终得到一个相当完整且有趣的结果。