我的做业week7——前端开发感想总结

我的做业week7——前端开发感想总结

---

 

1. 反思

首先要谈谈在此次团队项目的工做中，我这边出现过的较为严重的一个问题：
我和HoerWing (后端担当)合做时，最初由于我没有使用github(始终连不上，最后才确认是宿舍有线网的问题，没错就我那一个位置这样= =)，因此致使我和后端这块对于代码进展的状况严重不一样步，由于咱们要同时写一个网页，同时又由于是敏捷的工做模式，因此常常会须要作一些小的修饰，而在这个时候就会冲掉对方先前写的一些逻辑。整个项目中先后端对接是比较后期的一件事儿，因此这个问题最后才暴露出来，不过好在后端这边封装得很好，所以没有拖延整个工做流程过久，用无线连上github并和后端使用了一个共同的分支以后这个问题基本已经解决。

---

 

2. 网页开发中的‘大泥球’

我最初理解的是对于前端应该不须要过多考虑这方面的问题，但后来整个页面的绘制加前端逻辑写下来也是上千行的东西，结构和功能逻辑都会比较复杂，好比不一样的操做时页面元素的改变，用户保存实验数据，发送XML格式化的数据，后端处理完毕后返回正确结果或异常时按钮的响应状况是不一样的，相应的也会伴随着一些页面元件的样式变化，所以后端要作代码复审工做就会变成一件很是捉急的事情，这个在先后端对接的初期成为了一个相似于‘Big Ball of Mud’的东西，不过好在我跟后端沟通后结果了这个问题，那就是我来复审后端添加的逻辑代码，并将纯前端的内容分离拷贝出来以便本地查看实际效果，相比较前端的内容，后端添加的逻辑很精简也很易读，毕竟我这边没有配置事后端框架的环境(事实上也很差去在linux系统下作这些设计的事情，至于虚拟机，我可能会在年末考虑换硬盘的事儿，可是如今没有钱)，因此没有办法作到所见即所得，只能采起这么个这种的方案，不过好在对于一个小项目，这一点的影响不算很大。

---

 

3. 交易频繁的集市

对于集市和大教堂，我以为整个软件的项目能够从总体上视为一个大教堂，可是同一个部门(好比网页交互，计算核心开发)内部采起的是集市的模式，那么就会难免经常有两我的修改同一部分，结果出现各类代码上的冲突。对于学生时代的咱们而言，将这些冲突经过PM合理分配工做来化解实在是太难了，尽管PM很负责，可是我也能看到，更多时候他是经过本身重写有问题的部分来解决这些问题，相比较归咎于经验不足，我以为这多是软件工程中的广泛现象？所以我提倡若是要求敏捷，则对于一个独立出来的负责部门而言，或由一人负责，或由有良好交流的两我的结对编程来完成。这样对于敏捷开发过程当中的频繁更新状况，在作代码修正时的内部沟通成本也能够有效下降。

---

 

4. 代码优化与软件工程

每一个软件在开发的过程当中，都会不停地去考虑代码优化，或者说代码可扩展性以及兼容性的问题，所以这就增长了每次代码调整的成本（这要求咱们必须从新审视以前全部优化过的地方，可是更常见的场景是你有可能不知作别人所作的那一部分优化），好比为了不冗余我经常会采用jquery绑定的方式来为一组DOM对象绑定事件函数，但对于单一DOM对象的事件则回归JS的写法；对于中文字体的显示，考虑到网速问题，就放弃用下载来的中文字体去渲染而是经过创建合适的font-family顺序，针对不一样的用户调用其系统内置的优化字体去显示（将mac的冬青黑列在win的雅黑以前等等）；为了更好的兼容各类浏览器而放弃一些H5的新特性之类；因而当我须要改动的时候我本身都经常会忘记有哪些地方须要重构（在没有用户反馈的前提下），因此我发现果真最好的解决办法仍是回归PS（笑

---

 

5. Agile 敏捷

考虑到敏捷的要求，咱们使用了一些框架，而且参考了一些模板（如se7en）中一些css的写法，并提取出来放到网页的样式表中，此外也在codepen社区上摘了一些HTML+CSS的动态样式（LOADING动画），不过因为bootstrap定义了大量的类名使得作这种事儿命名冲突会比较难于处理，因此能本身写的样式部分我就全都本身写了，对于一些批量使用的样式（好比实验数据表格模态框），就集成到本身定义的样式表里，我以为这也是一个很好的前端初学者工做模式，用框架去保证兼容性和响应式布局的问题（虽然实际上仍是本身写了一些响应式的东西去应付较为特殊的状况），而后不去动框架，手写本身的自定义样式，并在它们反复出现的时候去作集成的工做，对于JS这边我想也是如此，即便引入jquery，一些简单的逻辑，或者较为基础的一些（如AJAX）仍是本身用JS原生的方式所有过一遍比较好，一方面有助于深刻理解前端开发，另外一方面在跟后端对接时也会比较有帮助。

开发时参考过的博客：
网页开发中的中文字体：http://www.ruanyifeng.com/blog/2014/07/chinese_fonts.html
JS中的面向对象：http://www.ruanyifeng.com/blog/2010/05/object-oriented_javascript_encapsulation.html