Web前端开发最佳实践[按需印刷]

    书籍
    计算机书籍
最近几年，Web前端的发展非常迅速，并呈现出一片欣欣向荣的景象。但层出不穷的新技术又扰乱了开发人员的思绪，以致很多开发人员疲于学习新技术而忽略了最基础的技术修炼。很多开发人员介绍*技术时头头是道，却无法制作出一个符合W3C规范的HTML页面。国内Web前端开发者普遍不重视代码规范以及网站前端性能，很多网站甚至连最基本的前端代码压缩和合并都没有。本书立足于Web前端开发的基础，介绍如何编写符合W3C规范、可维护性好且高性能的Web前端代码。
本书主要内容和特色：
以W3C Web规范为基础展开讨论，介绍Web前端开发中的*实践方法及编码风格，为Web前端开发人员快速成长提供一条捷径。
介绍近年来涌现出来并已经得到广泛应用的大量工具和技术方案，为开发人员从事Web前端开发打下坚实的基础。
循序渐进地介绍Web前端开发中的HTML、CSS、JavaScript编码实践方法，同时介绍Web移动端开发的实践，让读者对Web前端开发有一个全面的理解和认知。

党建，资深Web前端开发工程师。毕业于西安电子科技大学，后任职于西安葡萄城信息技术有限公司，从事Web前端和Web控件开发多年。目前为西安瑞木信息技术有限公司合伙人，负责公司Web项目前端架构及Web前端开发培训工作。精通HTML、CSS、JavaScript等前端技术，对ASP.NET、Node.js等Web开发技术也有深入的研究。善于总结各种开发*实践，并致力于Web相关规范的推广。

前　言
第一部分　高效Web前端开发综述
第1章　Web前端开发概述 2
1.1　Web前端开发的范畴 2
1.1.1　什么是Web前端开发 2
1.1.2　Web前端开发需要具备的技能 3
1.2　Web前端开发现状 6
1.3　规范的Web前端代码：更易维护、更高性能和更安全 9
第2章　高效Web前端开发 11
2.1　前端代码的结构组织和文件的命名 11
2.2　前端代码重构 13
2.3　合理使用前端框架 15
2.4　多浏览器测试：多测试，早测试 16
2.5　Web前端代码开发和调试 19
2.5.1　Web前端集成开发环境 19
2.5.2　Web前端代码调试 20
2.5.3　Web前端性能分析 21
2.5.4　代码和资源的压缩与合并 22
2.6　前端代码基本命名规范和格式规范 25
2.6.1　HTML命名规范及格式规范 25

　　为什么要写这本书
　　Web前端开发入门难度并不高，但是初学者如果没有一个很好的学习和编码习惯，则开发水平的提高速度会变得很慢。下面几点是影响Web前端开发者技术提高的主要因素。
　　其一是开发者缺乏良好的实践指导。Web前端兴起的时间不长，很多大学都还没有来得及开一门专门讲解Web前端的课程，因此，大部分的Web前端开发者都是通过自学的方式来了解Web前端相关的技术。开发者学习前端技术的渠道很多，其中很大一部分是通过查找网络资源的方式，而网络上充斥着大量的错误或者过时的实践方法，这些实践方法很容易误导初学者，使得初学者养成了一些不良的开发习惯。因此，Web前端开发的初学者非常需要一些能帮助他们快速、正确地进行Web前端开发的最佳实践方法。
　　其二是开发者容易产生浮躁的情绪。Web前端虽然兴起时间不长，但是发展很迅速，技术的更新换代也非常快，这本来是一件好事情，但也使得很多Web前端开发者产生了浮躁的情绪。开发者疲于追逐各种最新的技术，而忽略了最基础的技术概念。这些开发者对Node. js、AngularJS、Polymer等相关概念相当熟悉，但对HTML标准规范、AJAX的原理、CSS选择器的优先级等基本的概念却理解得不够深入。实质上，虽然Web前端技术更新换代速度很快，但也离不开HTML、CSS、JavaScript这3个基本的技术。Web前端的开发者应该明白：只有掌握了扎实的基础知识，才能在学习新技术的时候更容易上手，并且更快地理解新技术的原理，否则只是接触新技术的皮毛而已。
　　其三是开发者不善于利用各种开发工具。人类文明之所以快速发展，和人类善于使用工具是分不开的。人类是感性动物，并不能保证每次都能正确地做同样的事情，但工具不一样，只要环境相同，工具每次处理的结果应该是一样的。类比到Web前端开发中，聪明的程序员应该学会利用各种辅助开发工具来提高开发效率，减少不必要的错误。Web前端开发中的工具覆盖了开发过程的方方面面，包括设计、开发、测试、部署等阶段的辅助工具。善于使用工具也是Web前端开发中必备的一项技能。
　　笔者从2002年开始接触软件开发，先后接触过各种主流的开发技术，包括各种Web开发技术。从2008年开始，主要从事Web前端开发的工作。在这么多年的Web网站开发过程中，笔者深知技术基础、编码规范、辅助开发工具对软件开发的重要性，因此，在平时的开发中会特别注重这方面的积累，也非常乐意分享个人的开发经验以及使用过的效果较好的开发工具。
　　本书综合了笔者这些年来积累的各种Web前端开发经验以及各种高效的Web前端开发实践。如果把这些实践方法称为最佳实践，则有可能会引来争议，但这些实践方法的确是认可度很高的方法。从内容上说，本书是一本介绍如何高效地从事Web前端开发的书籍，而不是讲解Web前端技术的书籍。虽然技术更新非常快，但高效的开发实践方法则相对会更新得慢一些。开发者掌握这些高效的实践方法，会在开发过程中节省大量的成本，另外，在学习新技术的过程中，也会应对自如。
　　读者对象
　　本书主要适合以下读者：
　　对Web前端有浓厚兴趣的读者
　　Web前端开发工程师
　　Web项目的管理人员
　　如何阅读本书
　　本书将分为五大部分，第一部分为概述，第二、三、四部分分别介绍HTML、CSS、JavaScript相关的实践方法，最后一部分简单介绍移动Web开发相关的实践方法。每个部分相对独立，读者可以从头至尾通读，也可以选择感兴趣的部分
　　阅读。
　　第一部分（第1、2章）为高效Web前端开发综述。这部分将介绍前端开发中的基本规范、代码组织、重构及测试相关话题，同时也介绍一些好用的开发辅助
　　工具。
　　第二部分（第3～5章）为HTML相关开发最佳实践。这部分贴合W3C标准，介绍如何编写符合标准的、语义化的、可维护性高的HTML代码，并简单介绍HTML5规范中新添加的标签和属性的使用。
　　第三部分（第6～8章）为CSS相关开发最佳实践。这部分介绍如何编写高维护性和高性能的CSS代码。并简单介绍如何高效地使用CSS3中新添加的特性。
　　第四部分（第9～11章）为JavaScript相关开发最佳实践。该部分同样包含了如何编写高维护性和高性能的JavaScript代码。同时，编写JavaScript代码也要考虑代码的安全性，因此，该部分也会介绍Web前端中的各种攻击及防范方法。

　　市面上的书大多以讲解API为主，仅适合入门。而本书选了不常见却极为实用的方向——实践技巧来进行创作，实为难得。这种书很难写，没有丰富的经验是写不出这种书的。API是死的，无论新手、老手，还是高手，API的用法都是一样的，而实践技巧是活的，100个人可能会有100种实践，能力高低大部分体现在这里——新手和高手写出来的代码一眼就能看出来。如果你正为进阶和实践技巧犯愁，那么本书正是你需要的；如果你已经形成个人的编程风格，不妨也来看看这本书中的实践技巧和你有多少出入，取长补短。
　　—— 曹刘阳（阿当） 创业中的首席架构师，《编写高质量代码：Web前端开发修炼之道》作者
　　本书是近年来前端开发相关书籍和网络资料的集大成者，以广阔的视角阐述了前端开发人员需要掌握的专业知识和开发工具，同时用工程化的方式来培养编程习惯、提升开发效率，是前端开发人员和项目管理者的必备参考。目前的前端非常繁荣，也非常混乱，有太多的作品和人需要鉴别、学习；而大部分前端开发人员并非科班出身，在轻松踏入前端领域后，很快会在开发技能和项目管理上遇到瓶颈，正所谓“乱花渐欲迷人眼，浅草才能没马蹄”。本书则系统地对前端开发的历史和现状进行了思考与整理，为前端开发人员指明了一条成长之路，也为前端项目管理提供了行之有效的评估标准。
　　—— 高云 *资深前端开发工程师，《jQuery技术内幕》作者市面上的书大多以讲解API为主，仅适合入门。而本书选了不常见却极为实用的方向——实践技巧来进行创作，实为难得。这种书很难写，没有丰富的经验是写不出这种书的。API是死的，无论新手、老手，还是高手，API的用法都是一样的，而实践技巧是活的，100个人可能会有100种实践，能力高低大部分体现在这里——新手和高手写出来的代码一眼就能看出来。如果你正为进阶和实践技巧犯愁，那么本书正是你需要的；如果你已经形成个人的编程风格，不妨也来看看这本书中的实践技巧和你有多少出入，取长补短。
　　—— 曹刘阳（阿当） 创业中的首席架构师，《编写高质量代码：Web前端开发修炼之道》作者
　　本书是近年来前端开发相关书籍和网络资料的集大成者，以广阔的视角阐述了前端开发人员需要掌握的专业知识和开发工具，同时用工程化的方式来培养编程习惯、提升开发效率，是前端开发人员和项目管理者的必备参考。目前的前端非常繁荣，也非常混乱，有太多的作品和人需要鉴别、学习；而大部分前端开发人员并非科班出身，在轻松踏入前端领域后，很快会在开发技能和项目管理上遇到瓶颈，正所谓“乱花渐欲迷人眼，浅草才能没马蹄”。本书则系统地对前端开发的历史和现状进行了思考与整理，为前端开发人员指明了一条成长之路，也为前端项目管理提供了行之有效的评估标准。
　　—— 高云 *资深前端开发工程师，《jQuery技术内幕》作者
　　本书基于作者多年在实际项目中所积累的丰富编程经验，深入浅出地介绍了Web前端和移动端的代码编程技术，无论初级、中级或高级Web和移动开发编程人员，都可以从本书中学习到有用的实际项目的经验，比如：
　　什么是合理、有效的前端架构；
　　如何写出高质量、高性能、可维护的HTML/CSS/JavaScript代码；
　　如何重构HTML/CSS/JavaScript代码；
　　如何调试前端代码。
　　“真相只存在于代码之中。”对于一个追求高质量架构和HTML/CSS/JavaScript代码的专业编程人员来说，本书是一本不可多得的好书。
　　——冯伟GrapeCity 公司技术主管