打造高品质前端 – YUI应用.pptxVIP

资料下载/sharing/YUI@tuling/yui.ppt/sharing/YUI@tuling/yui.ppt打造高品质前端 – YUI应用张克军//kejunz/kejunz张克军 (Kejun)前端工程师/D2委员会成员雅虎中国UED – 前端开发小组主要负责前端开发流程、开发标准、品质提升mailto:kejun@kejun@//kejunz/kejunzYIM: listenproGTalk: listenpro1999.102002.122005.22007.5 (YUI)/photos/kejun/521035874/sizes/o/in/set-72157594522105362//photos/kejun/521035874/sizes/o/in/set-72157594522105362/雅虎中国的前端开发专职F2E= 0表格布局简单的DHTML无组织、无纪律的开发专职F2E= 2DIV布局支持GBSAjax/丰富的交互体验建立规范专职F2E= 12(还在招募中…)团队协作开发品质提升统一的FDP200520082007推广YUI至全部产品线Christian Heilmann@WDN/cheilmann/the-role-of-java-script/cheilmann/the-role-of-java-script伴随前端技术的演变开发中的问题也在随之改变The page is an application with a data connection to a server.- Douglas Crockford (Yahoo!资深架构师)RIA组件(tabview, carousel, slideshow…)高级UI效果(圆角, 阴影, …)高级页面布局当前前端开发中要解决的问题性能体验(UPP, PLT, CPU消费, 内存占用…)协作开发数据处理(Ajax)YUI提供了一套完整的解决方案/http://YUIL优化/测试交互行为模块结构(布局)CSS Grids提供超过1000种布局（/yui/grids/详细, /sharing/share_grids/slide.html介绍）提供桌面软件风格的页面布局（/yui/layout/详细）Layout Manager维护ButtonCalendarColor PickerMenuCarouselContainer (Module, Overlay, Panel, ToolTip, Dialog, SimpleDialog)PaginatorRich Text EditorTabViewTreeViewAutoCompleteSliderChartsImage CropperDataTableUploader优化/测试交互行为模块RIA控件结构(布局)维护优化/测试交互行为基本开发元件(Utility)DataSourceBrowser History Manager模块Connection ManagerJSONCookieElementDragDropResizeAnimation结构(布局)StyleSheetDOMEventSelectorYUI LoaderGetGlobal Object YAHOO.namespace,YAHOO.lang,YAHOO.env,YAHOO.log维护优化/测试交互行为Logger ControlProfilerProfiler ViewerYUI Test Utility模块YUI Compressor结构(布局)维护优化/测试YUI Doc交互行为模块结构(布局)维护YUI是覆盖前端开发各个环节最全面的开源框架YUI太大?YUI 2.6.0开始使用YUI进行开发YUI Grids Builder快速创建页面布局更多/sharing/share_grids/slide.html介绍///2.6.0/build/yuiloader/yuiloader-min.js/2.6.0/build/yuiloader/yuiloader-min.js (27.6K)YUI LoaderGetGlobal Object YAHOO.namespace,YAHOO.lang,YAHOO.env,YAHOO.log使用YUILoader管理项目文件var loader = new Y.util.YUILoader({ base: /2.6.0/build/, loadOptional: true, require: [event, selector, carousel], onSuccess: function(){ YS = Y.util.Selector; YD = Y.util.Dom; YE = Y.util