文档介绍：Web应用前端研发的探索与实践FrontWebTechnologyExplorationandPractice提纲开场白1前端开发工作探索2前端组件及综合应用3回顾、展望4目的简化的同时使用简单并且具有一定通用性的方法解决问题工作愿望使技术与销售的互动结果最大化我欣赏的一句话没有做不到,只有想不到我印象深刻的一句话每天早晨醒来,一想到所从事的工作和所开发的技术将会给人类生活带来巨大的影响和变化,我就会无比的兴奋与激动兴趣搜索及关联产品终端软件及其产品市场、创意及其实施开场白开场白1前端组件及综合应用3提纲前端开发工作探索21、问题和挑战2、工作过程3、提高质量和效率4、从前端优化系统回顾、展望4前端工作的重要性、产品现状产品现状跨浏览器的问题一直存在页面代码的问题,曾导致业务故障多次页面代码的问题,导致很多业务的页面打开都不够快没有进行统一、系统的组织和管理UI近5年里改动不多:工作量大占到全部时间的80%甚至更多对进度、资源配置等影响很大影响其它工作的投入时间:项目特性、数据准确性等UI不美观,影响客户第一印象不一致,影响产品整体和成熟度UE效果不够,导致用户使用不便支撑业务不够:无法带给用户良好使用体验其它难以维护难以测试容易存在垃圾代码和无用代码,甚至极大地影响页面打开速度06年现在前端开发工作的挑战互联网应用的UI/UE达到Sina、腾讯等的同等水准电信项目的UI/UE达到国内一流糟糕的页面实现,头疼的维护工作实现系统需求提高系统的可维护性为将来的变化提前做准备结构、样式和行为的分离HTML、JS/VBScript、CSS、XML、XHTML,还有Applet、Flash客户端与浏览器交叉、混合Html、JS、CSS三者之间无严格界限浏览器类别、版本多样,IE6-9、Chrome、FireFox、Opera、终端浏览器需要处理文字、线条、多种格式的图片和视频应用类型众多JSP、Servlet、CGI、PHP等与内容的处理、展示混合起来用java输出Html/JS/CSS等近年来的趋势同步、异步(AJAX)混杂使内容的处理、展示复杂化须适配的终端多元化、多样化:PC浏览器、ITV机顶盒、手机、平板电脑、手机客户端等复杂性使用frameset大量的iframediv布局和table布局混用标签名有大写的,也有小写的标签属性有的加了引号,有的没有加引号历史遗留的、被淘汰的属性泛滥样式组织混乱,有用<style>标签写进网页里的,有用<link>外链的,也有直接写在标签内的JavaScript有外链的,有写在<scirpt>标签内的,也有写在标签里的JavaScript和CSS的位置零乱JavaScript的编码风格很不一致JavaScript文件很多CSS文件很多缺少注释代码问题问题的解决目的提高UI/UE效果提高前端代码的质量思路系统组织、抓住重点、简化工作范围基于PC浏览器和终端浏览器的应用UI效果:简洁、美观、一致代码:简洁,只有必要的代码UE快速:用户操作的响应快最少化:用户必须的输入、必须做的操作设计、开发最少化:开发人员必须手工编写的代码简化后台的开发,减少重复代码自动生成,尽量解放研发人员使业务、特性、数据处理、提高可维护性等有更多时间CSS模版组件库工程模版自动化实施策略建立、维护CSS模板、Web工程模版使用自定义自动化工具组织资源化繁为简,建设自己的组件库通过规范设计、开发工作确保质量子提纲1、问题和挑战2、工作过程3、提高质量和效率4、立足前端的系统优化措施前端开发工作探索2前端研发的工作过程常见过程:规范过程:避免返工、加强协作、提升效果