html/css/javascript项目模块化最佳实践

与Java/C#/C/C++项目相比，我们经常看到web前端项目（html/css/javascript）过于复杂，无法读取和维护。那么，我们可以总结一些web前端项目的最佳实践吗？目标是可读性、模块化、易于维护。

实现这一目标需要混合好的模式，并知道什么是战斗而不是战斗

CSS是最好的，如果它是经过分解的、高效的和干净的格式。这里不需要过度思考，CSS是一种漂亮的语言，我喜欢保持简单。例如，请参见我的答案：

Javascript完全可以通过使用某种基于对象的模式来组织：。我使用了与该链接中的“自定义对象”相近的内容。使用YUI，我们构建了名称空间，使用jQuery，我们可以添加它们：。在分离内容方面，在各自的javascript文件中分离对象和相关功能，并将它们包含在需要的页面上。为了优化，您可以将任何页面上的所有脚本编译为一个脚本。YUI 3有一个很好的依赖项加载机制——使用它。对于jQuery，您可以使用许多依赖项加载程序之一：

就HTML而言，我认为MVC是当今最流行的模式。使用任何现代mvc框架都会为您做好准备。（例如rails、任意java、asp.net mvc、挂架等）

---

目前，web开发有很多方法，没有标准的方法

顺便说一句，由于JavaScript不支持某些OOP特性，如实际的类或名称空间，但支持原型设计，因此您需要知道，这对于创建好的大型模块化前端Web项目来说不是一个好的开始

虽然有一些限制，但您可以使用原型来利用某种伪OOP设计。也就是说，您可以基于定义常见行为和可视化的抽象层次结构的继承来创建面向组件的用户界面

记住，任何现代开发中最重要的一点是重用和可伸缩性，我认为将伪OOP与原型设计结合使用应该是好的，以避免不良实践，并加强可维护性、可读性和模块化

例如，可以使用原型模拟名称空间。这是通过创建匿名对象实现的，在匿名对象中，其成员是充当getter（属性）的匿名函数，其返回类型是某些实际“类”的原型-还有其他方法可以实现相同的结果-：

或者您可以模拟多态性：

我可以添加更多的引用，但我相信你已经做到了：这更像是尝试将实际的OOP方法导出到JavaScript，并使用已经存在多年的相同设计模式

---

另一点应该是，您可以通过扩展jQuery、Prototype、MooTools、Microsoft AJAX等现有JavaScript框架来实现这种模块化（这是一个良好的开端，因为它有许多内置的OOP功能，如名称空间、继承、多态性……。

下面有一些好的评论。我还想补充一点，“高性能网站”一书为前端开发提供了一些非常好的最佳实践知识——主要涉及性能技巧，但仍然值得一读。我想你会喜欢的