Web开发模式演变知识分享PPT课件

2020年4月20日 Web开发模式演变 零售信息应用开发二室李镇邦 2 目录 一 简单明快的早期时代二 后端为主的MVC时代三 Ajax带来的SPA时代四 Node带来的全栈时代五 总结 3 一 简单明快的早期时代 可称之为Web1 0时代 单纯通过网络浏览器浏览html网页 非常适合创业型小项目 经常3 5人不分前后端搞定所有开发 WEB1 0框架图 4 简单明快带来的问题 业务复杂度提高Service越来越多 相互调用关系变复杂 考虑团队协作 往往会搭建集中式的开发服务器来解决 这种解决方案对编译型的后端开发来说也许还好 但对前端开发来说并不友好 例子 前端需要调整下按钮样式 却要本地开发 代码上传 验证生效等好几个步骤 无法实现所见即所得 开发效率低 JSP代码可维护性降低JSP强大 可以内嵌Java代码 为了赶项目 为了各种紧急需求 会在JSP里揉杂大量业务代码 导致前后端的职责不清晰 往往会带来大量维护成本 5 二 后端为主的MVC时代 为了降低复杂度 以后端为出发点 出现了MVC架构 主流的有Struts Webwork SpringMVC等 MVC通过将数据 界面显示 业务逻辑分离的方法组织代码 将业务逻辑聚集到一个部件里面 在个性化定制界面及用户交互的同时 不需要重新编写业务逻辑 StrutsMVC框架 6 MVC架构的特点 主要优点1 耦合性低 重用性高2 开发效率高 可维护性高不足之处1 增加系统结构和实现的复杂性2 视图与模型严格分离视图对模型数据的访问效率降低调试应用程序带来一定的困难 7 三 Ajax带来的SPA时代 AJAX AsynchronousJavascriptAndXML 2005年横空出世 它是一种用于创建快速动态交互式网页应用的开发技术 浏览器与Web服务器之间使用异步数据传输 HTTP请求 这样就可使网页从服务器请求少量的信息 而不是整个页面 加上CDN开始大量用于静态资源存储 于是出现了SPA时代 SPA singlepagewebapplication 单页面应用 它将所有的活动局限于一个Web页面中 仅在该Web页面初始化时加载相应的HTML JS和CSS 一旦页面加载完成了 单页面应用不会因为用户的操作而进行页面的重新加载或跳转 而是利用JS动态的切换DIV显示与隐藏 从而实现UI和用户的交互 由于避免了页面的重新加载 单页面应用可以提供较为流畅的用户体验 单页面应用框架angularJS backbone KnockoutJS等 8 三 Ajax带来的SPA时代 SPA架构图 前后端接口的约定前端开发的复杂度 关注点以及挑战 9 四 Node带来的全栈时代 MVC和SPA模式解决很了很多问题 依旧存在一些欠缺 随着Node js的兴起 JS开始有能力运行在服务端 这意味各司其职着可以有一种新的开发模式 在这种研发模式下 前后端的职责很清晰 10 四 Node带来的全栈时代 NODE JS1 开源的 跨平台的JavaScript运行环境2 基于谷歌的V8JavaScript引擎3 使用事件驱动全栈式JavaScriptjQuery Node js MongoDB全栈面临的挑战1 需要前端对服务端编程有更进一步的认识 比如network tcp ip等知识的掌握 2 对前后台部署 运维层面的熟练了解 需要更多知识点和实战操作经验 11 总结 遵循关注点分离原则 让前后端的