1.审查页面，提取公共部分

2.提前引入所需的组件

3.定义好所需字段，注意生命周期的前后顺序，不要出现页面还没加载过程中，先出现无数据的界面

4.不要遗漏任何地方的事件，并且注意事件的完整性。不要只修当前页面，所牵扯的页面也要完善，不能改了这个，错了那个。

5.控制好的用户体验，例如：增加点击范围，加入好的过渡~

6.不要遗漏上拉加载，下拉刷新，置顶 等等小的功能

7.给适当的地方，加上适当时间的提示框

8.减少for循环，如果有for循环，把arr.length定义在外部，减少循环工作量

9.注意清除页面滚动

10.页面完成后，换手机测试，保证安卓和ios 显示都是正常的。

11.页面完成后删除所有console和alert

12.打包的时候，注意修改index和build里面的相关内容，提高打包效率。

13.打包后，多点点，看看页面有没有打包后的问题，注意优化。

14.整个页面在写之前首先应该先把大的框架搭出来，在去写里面小的细节。保证大的框架没有问题，里面有问题，大不了删了重写。（给大的框架加上background测试是最直观看到大框架是否正确的方式）

15.整个页面的布局，要尽可能的灵活，因为所有的元素都是不定高的，这是由于，后台要加什么东西前台页面是不知道的，如果写的很死，那么后台在写程序的时候，就会把页面撑乱，这是不可取的。

15.清除浮动的问题，一定要记住。

17.兼容性问题，平时有时间一定要多了解各种浏览器的hack，及解决方法。

18.前端写页面，必不可少的是注释，而且注释一定要清晰明了，HTML页面和CSS样式表都要写注释，注释对自己和后台程序人员都是非常重要的。

19.命名问题，一定要有一个命名规范，因为页面不是只有一个，通常一套网站会有好几个页面去写，那么命名的规范性就显得尤为重要，例如：网页头部，命名是不能都叫head，因为他们是共用一个CSS样式表的，要有所区分，首页头部，就叫index_head，列表页头部就叫list_head，总之，命名的规范性和区别一定要注意。

20.公共部分，能共用的，一定要写成公共区域，不要重复写一些相同的代码，代码应该尽量的简洁。

命名不要出现 ad / Ad / ad- ……等跟 ad（广告）有关的字眼。

现代浏览器使得用户可以装各种广告屏蔽的插件，你应该不希望自己的网站被意外屏蔽掉吧！

如果不打算做响应式，就记得设置页面的最小宽度。

要不然手动改变浏览器宽度，或者电脑屏幕偏小时，页面就有可能出现布局错乱，其实只要提前设置好 body 的最小宽度，就能避免这种令人不愉快的场面出现。

常用 font-family: "Microsoft YaHei",Arial,Helvetica,sans-serif;

使用button标签时，如果只是用于简单的按钮布局而不是表单提交，那么在标签内部记得写明type="button"，要不然该按钮默认为submit按钮，点击会提交表单并刷新页面。

多少次莫名奇妙就刷新页面或者提交表单了……

如果不希望 input 输入框出现黄色的背景，那就写明 autocomplete="off"。。

自动填充的输入框就是会有黄色的背景，觉得丑就先发制人吧。

按钮或者可点击区域记得写cursor: pointer;。

这是对用户更友好的可点击标识，布局时要有写的意识，要不然后期修修补补很心累。可以提前写好一个专门的类，e.g..c_p{ cursor: pointer; }，然后写标签时有需要就用上。

a 标签不用于点击跳转而只是用于布局，属性href就这么写：href="javascript:void(0);"或href="javascript:;"。

这样点击 a 标签时页面就不会刷新或者移动到顶部了~

class 或者 id 的命名，建议参考 Bootstrap 或者其他用习惯了的 UI 框架。