模板开发初探<br />
正在做的有意义的事<br />
服务化<br />后端技术营造的基石<br />开放接口<br />减弱第三方开发的强依赖<br />前端主动开发可能<br />
页面组件化<br />全新的页面搭建机制<br />和v4框架有着很高的契合度<br />独角兽<br />Style优化的尝试<br />模板层的按需加载<br />流程优化<br />……<br />
简单了解下vm模板<br />
第一个Hello world<br />
绑定开发服务器: 10.20.131.8 baike-ui.china.alibaba.com 9001<br />新建一个test.vm<br />
可以自己模拟异步接口假数据??<br />
一个模板片段<br />
Vm模板特点<br />html语言+一些特殊的语法标识符<br />基本保持了html的原汁原味<br />更偏向于前端<br />暂时模板变量引用可能会无所适从?<br />
3个概念<br />layout<br />页面框架<br />control<br />可重用的代码片段<br />screen<br />个性化页面<br />
layout篇<br />
一个产品线的页面框架<br />应该只有几个!!<br />等等……<br />
模板层的页面框架layout<br />Layout的特性:<br />①公用的产品页面框架,会引入产品公用的control,如header、footer<br />②它和产品级的js、css基本保持一致<br />③screen解析先于lay...
模板中layout现状<br />Layout的数量:好的产品线,有30~40个,多的甚至有上百个……<br />和曾经的js、css一样,v1,v2,v3…v44?<br />只有产品级js、css,而产品级layout概念很弱<br />L...
合理使用layout的几个技巧<br />Layout必须与产品级的js、css对应,功能保持一致<br />每新增一个layout,必须在这个layout中遵循注释规范<br />禁止在layout中增加页面级个性化需求<br />现有lay...
管理页面框架的调用关系<br />Layout与产品级的js、css三位一体<br /><ul><li>产品线升级,框架替换,无非是新生成一个layout</li></li></ul><li>control篇<br />
一个子产品公用的头部<br />
独角兽带来的契机<br />——模板层的按需加载<br />
自动合并的特性帮我们更好的完成了这一前端的理念<br />
screen篇<br />
业务逻辑复杂?<br />前端不能回避的问题<br />只要有序,复杂并不可怕<br />前端了解业务逻辑的机会<br />掌握了业务逻辑,前端还有什么做不了的?<br />
前端是模板中页面框架的把控者<br />
权限?<br />环境?<br />约定?<br />质量?<br />资源?<br />
前端是应用开发的主力<br />
做更多有含金量的事情<br />
Q&A<br />
模板开发初探
Upcoming SlideShare
Loading in...5
×

模板开发初探

312

Published on

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
312
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
2
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

模板开发初探

  1. 1. 模板开发初探<br />
  2. 2.
  3. 3. 正在做的有意义的事<br />
  4. 4. 服务化<br />后端技术营造的基石<br />开放接口<br />减弱第三方开发的强依赖<br />前端主动开发可能<br />
  5. 5. 页面组件化<br />全新的页面搭建机制<br />和v4框架有着很高的契合度<br />独角兽<br />Style优化的尝试<br />模板层的按需加载<br />流程优化<br />……<br />
  6. 6. 简单了解下vm模板<br />
  7. 7. 第一个Hello world<br />
  8. 8. 绑定开发服务器: 10.20.131.8 baike-ui.china.alibaba.com 9001<br />新建一个test.vm<br />
  9. 9. 可以自己模拟异步接口假数据??<br />
  10. 10. 一个模板片段<br />
  11. 11.
  12. 12. Vm模板特点<br />html语言+一些特殊的语法标识符<br />基本保持了html的原汁原味<br />更偏向于前端<br />暂时模板变量引用可能会无所适从?<br />
  13. 13. 3个概念<br />layout<br />页面框架<br />control<br />可重用的代码片段<br />screen<br />个性化页面<br />
  14. 14. layout篇<br />
  15. 15. 一个产品线的页面框架<br />应该只有几个!!<br />等等……<br />
  16. 16. 模板层的页面框架layout<br />Layout的特性:<br />①公用的产品页面框架,会引入产品公用的control,如header、footer<br />②它和产品级的js、css基本保持一致<br />③screen解析先于layout,这一特性使layout可以取到screen中变量<br />④可重用,能代表产品线演化的风格<br />……<br />
  17. 17.
  18. 18. 模板中layout现状<br />Layout的数量:好的产品线,有30~40个,多的甚至有上百个……<br />和曾经的js、css一样,v1,v2,v3…v44?<br />只有产品级js、css,而产品级layout概念很弱<br />Layout正在被滥用,渐渐丢失它原来承载的含义<br />Layout的混乱甚于单个页面的混乱<br />需要前端参与去改变<br />
  19. 19. 合理使用layout的几个技巧<br />Layout必须与产品级的js、css对应,功能保持一致<br />每新增一个layout,必须在这个layout中遵循注释规范<br />禁止在layout中增加页面级个性化需求<br />现有layout满足不了开发需求,请按规范整理出layout,否则setLayoutTemplate(null)<br />有些小范围公用的东西,有个适合的方案control<br />所有layout调用,推荐使用setLayoutTemplate(“xx.vm”)的指明调用<br />
  20. 20. 管理页面框架的调用关系<br />Layout与产品级的js、css三位一体<br /><ul><li>产品线升级,框架替换,无非是新生成一个layout</li></li></ul><li>control篇<br />
  21. 21. 一个子产品公用的头部<br />
  22. 22. 独角兽带来的契机<br />——模板层的按需加载<br />
  23. 23. 自动合并的特性帮我们更好的完成了这一前端的理念<br />
  24. 24. screen篇<br />
  25. 25. 业务逻辑复杂?<br />前端不能回避的问题<br />只要有序,复杂并不可怕<br />前端了解业务逻辑的机会<br />掌握了业务逻辑,前端还有什么做不了的?<br />
  26. 26. 前端是模板中页面框架的把控者<br />
  27. 27. 权限?<br />环境?<br />约定?<br />质量?<br />资源?<br />
  28. 28.
  29. 29.
  30. 30. 前端是应用开发的主力<br />
  31. 31. 做更多有含金量的事情<br />
  32. 32. Q&A<br />
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×