Enviar búsqueda
Cargar
MobileWebAppFramework_V5_design
•
2 recomendaciones
•
1,124 vistas
Jackson Tian
Seguir
https://github.com/V5Framework/V5 Mobile Web App Framework. Lightweight.
Leer menos
Leer más
Tecnología
Denunciar
Compartir
Denunciar
Compartir
1 de 35
Descargar ahora
Descargar para leer sin conexión
Recomendados
犀牛书第六版
犀牛书第六版
jay li
赶集团购开发总结4
赶集团购开发总结4
yangdj
Jswebapps
Jswebapps
jay li
Real World ASP.NET MVC
Real World ASP.NET MVC
jeffz
【项目分享】赶集移动Web App开发总结
【项目分享】赶集移动Web App开发总结
yangdj
CardKit & DOMO UI - 移动时代技术与设计的十字路口
CardKit & DOMO UI - 移动时代技术与设计的十字路口
Dexter Yang
2021laravelconftwslides9
2021laravelconftwslides9
LiviaLiaoFontech
Wap2.0
Wap2.0
style80
Recomendados
犀牛书第六版
犀牛书第六版
jay li
赶集团购开发总结4
赶集团购开发总结4
yangdj
Jswebapps
Jswebapps
jay li
Real World ASP.NET MVC
Real World ASP.NET MVC
jeffz
【项目分享】赶集移动Web App开发总结
【项目分享】赶集移动Web App开发总结
yangdj
CardKit & DOMO UI - 移动时代技术与设计的十字路口
CardKit & DOMO UI - 移动时代技术与设计的十字路口
Dexter Yang
2021laravelconftwslides9
2021laravelconftwslides9
LiviaLiaoFontech
Wap2.0
Wap2.0
style80
Wap2.0
Wap2.0
guest902b532
Angularjs
Angularjs
宗哲 謝
漫谈web前端
漫谈web前端
woody huang
移动Web开发框架jqm探讨
移动Web开发框架jqm探讨
newker
ASP.NET MVC之實戰架構探討 -twMVC#5
ASP.NET MVC之實戰架構探討 -twMVC#5
twMVC
常用Js框架比较
常用Js框架比较
Adam Lu
Knockout js
Knockout js
tb-vertical-guide
20131004 - Backbone js 介紹 by Bryan
20131004 - Backbone js 介紹 by Bryan
LearningTech
Mvc
Mvc
Yun-tao Chen
Js高级技巧
Js高级技巧
fool2fish
twMVC#05 |開發與移轉 ASP.NET MVC 4.0 應用程式到 Windows Azure Platform
twMVC#05 |開發與移轉 ASP.NET MVC 4.0 應用程式到 Windows Azure Platform
twMVC
Java Script 调试
Java Script 调试
guest8ef035
高端版Tmall
高端版Tmall
tbmallf2e
Silverlight 2.0 完全新手學堂,基礎入門 10 大招
Silverlight 2.0 完全新手學堂,基礎入門 10 大招
Chui-Wen Chiu
Silverlight 开发简介
Silverlight 开发简介
beginor
How tovuejs
How tovuejs
Daniel Chou
Html5form
Html5form
jay li
淘宝前端技术巡礼
淘宝前端技术巡礼
jay li
Stock market crash
Stock market crash
Terryl Meador
World War I Terms
World War I Terms
Terryl Meador
October 22nd
October 22nd
Pauospina
Browser vs. Node.js Jackson Tian Shanghai
Browser vs. Node.js Jackson Tian Shanghai
Jackson Tian
Más contenido relacionado
La actualidad más candente
Wap2.0
Wap2.0
guest902b532
Angularjs
Angularjs
宗哲 謝
漫谈web前端
漫谈web前端
woody huang
移动Web开发框架jqm探讨
移动Web开发框架jqm探讨
newker
ASP.NET MVC之實戰架構探討 -twMVC#5
ASP.NET MVC之實戰架構探討 -twMVC#5
twMVC
常用Js框架比较
常用Js框架比较
Adam Lu
Knockout js
Knockout js
tb-vertical-guide
20131004 - Backbone js 介紹 by Bryan
20131004 - Backbone js 介紹 by Bryan
LearningTech
Mvc
Mvc
Yun-tao Chen
Js高级技巧
Js高级技巧
fool2fish
twMVC#05 |開發與移轉 ASP.NET MVC 4.0 應用程式到 Windows Azure Platform
twMVC#05 |開發與移轉 ASP.NET MVC 4.0 應用程式到 Windows Azure Platform
twMVC
Java Script 调试
Java Script 调试
guest8ef035
高端版Tmall
高端版Tmall
tbmallf2e
Silverlight 2.0 完全新手學堂,基礎入門 10 大招
Silverlight 2.0 完全新手學堂,基礎入門 10 大招
Chui-Wen Chiu
Silverlight 开发简介
Silverlight 开发简介
beginor
How tovuejs
How tovuejs
Daniel Chou
Html5form
Html5form
jay li
淘宝前端技术巡礼
淘宝前端技术巡礼
jay li
La actualidad más candente
(18)
Wap2.0
Wap2.0
Angularjs
Angularjs
漫谈web前端
漫谈web前端
移动Web开发框架jqm探讨
移动Web开发框架jqm探讨
ASP.NET MVC之實戰架構探討 -twMVC#5
ASP.NET MVC之實戰架構探討 -twMVC#5
常用Js框架比较
常用Js框架比较
Knockout js
Knockout js
20131004 - Backbone js 介紹 by Bryan
20131004 - Backbone js 介紹 by Bryan
Mvc
Mvc
Js高级技巧
Js高级技巧
twMVC#05 |開發與移轉 ASP.NET MVC 4.0 應用程式到 Windows Azure Platform
twMVC#05 |開發與移轉 ASP.NET MVC 4.0 應用程式到 Windows Azure Platform
Java Script 调试
Java Script 调试
高端版Tmall
高端版Tmall
Silverlight 2.0 完全新手學堂,基礎入門 10 大招
Silverlight 2.0 完全新手學堂,基礎入門 10 大招
Silverlight 开发简介
Silverlight 开发简介
How tovuejs
How tovuejs
Html5form
Html5form
淘宝前端技术巡礼
淘宝前端技术巡礼
Destacado
Stock market crash
Stock market crash
Terryl Meador
World War I Terms
World War I Terms
Terryl Meador
October 22nd
October 22nd
Pauospina
Browser vs. Node.js Jackson Tian Shanghai
Browser vs. Node.js Jackson Tian Shanghai
Jackson Tian
1stscenario presentation
1stscenario presentation
conlonmufc1999
World War I terms
World War I terms
Terryl Meador
Destacado
(6)
Stock market crash
Stock market crash
World War I Terms
World War I Terms
October 22nd
October 22nd
Browser vs. Node.js Jackson Tian Shanghai
Browser vs. Node.js Jackson Tian Shanghai
1stscenario presentation
1stscenario presentation
World War I terms
World War I terms
Similar a MobileWebAppFramework_V5_design
D2-ETao-show
D2-ETao-show
leneli
Hello reactJS 0~1 Bulid my first web app
Hello reactJS 0~1 Bulid my first web app
hungjie19
React js入門
React js入門
昶宇 賴
Javascript template & react js 初探
Javascript template & react js 初探
wantingj
Windows 8 apps dev.整理及分享
Windows 8 apps dev.整理及分享
Liyao Chen
OPOA in Action -- 使用MagixJS简化WebAPP开发
OPOA in Action -- 使用MagixJS简化WebAPP开发
leneli
Single-Page Application Design Principles 101
Single-Page Application Design Principles 101
Jollen Chen
twMVC#01 | ASP.NET MVC 的第一次親密接觸
twMVC#01 | ASP.NET MVC 的第一次親密接觸
twMVC
Non-MVC Web Framework
Non-MVC Web Framework
Fred Chien
Visual studio 2012 與 asp.net 4.5 (新功能與開發介紹) 第一天
Visual studio 2012 與 asp.net 4.5 (新功能與開發介紹) 第一天
Gelis Wu
建立前端开发团队 (Front-end Development Environment)
建立前端开发团队 (Front-end Development Environment)
Joseph Chiang
程式人雜誌 -- 2015 年1月號
程式人雜誌 -- 2015 年1月號
鍾誠 陳鍾誠
前端基础知识回顾
前端基础知识回顾
Wu tianhao
ASP.NET Core MVC 2.2從開發到測試 - Development & Unit Testing
ASP.NET Core MVC 2.2從開發到測試 - Development & Unit Testing
江華 奚
Learning JavaScript in Three Web Apps(中文)
Learning JavaScript in Three Web Apps(中文)
Dexter Yang
ASP.NET Core 2.1設計新思維與新發展
ASP.NET Core 2.1設計新思維與新發展
江華 奚
高粒度模块化的前端开发
高粒度模块化的前端开发
iddcn
ASP.Net MVC2 简介
ASP.Net MVC2 简介
Allen Lsy
react native by letv
react native by letv
feeloc
IDDD Ch.09 Module
IDDD Ch.09 Module
Eason Kuo
Similar a MobileWebAppFramework_V5_design
(20)
D2-ETao-show
D2-ETao-show
Hello reactJS 0~1 Bulid my first web app
Hello reactJS 0~1 Bulid my first web app
React js入門
React js入門
Javascript template & react js 初探
Javascript template & react js 初探
Windows 8 apps dev.整理及分享
Windows 8 apps dev.整理及分享
OPOA in Action -- 使用MagixJS简化WebAPP开发
OPOA in Action -- 使用MagixJS简化WebAPP开发
Single-Page Application Design Principles 101
Single-Page Application Design Principles 101
twMVC#01 | ASP.NET MVC 的第一次親密接觸
twMVC#01 | ASP.NET MVC 的第一次親密接觸
Non-MVC Web Framework
Non-MVC Web Framework
Visual studio 2012 與 asp.net 4.5 (新功能與開發介紹) 第一天
Visual studio 2012 與 asp.net 4.5 (新功能與開發介紹) 第一天
建立前端开发团队 (Front-end Development Environment)
建立前端开发团队 (Front-end Development Environment)
程式人雜誌 -- 2015 年1月號
程式人雜誌 -- 2015 年1月號
前端基础知识回顾
前端基础知识回顾
ASP.NET Core MVC 2.2從開發到測試 - Development & Unit Testing
ASP.NET Core MVC 2.2從開發到測試 - Development & Unit Testing
Learning JavaScript in Three Web Apps(中文)
Learning JavaScript in Three Web Apps(中文)
ASP.NET Core 2.1設計新思維與新發展
ASP.NET Core 2.1設計新思維與新發展
高粒度模块化的前端开发
高粒度模块化的前端开发
ASP.Net MVC2 简介
ASP.Net MVC2 简介
react native by letv
react native by letv
IDDD Ch.09 Module
IDDD Ch.09 Module
Más de Jackson Tian
D2_node在淘宝的应用实践_pdf版
D2_node在淘宝的应用实践_pdf版
Jackson Tian
D2_Node在淘宝的应用实践
D2_Node在淘宝的应用实践
Jackson Tian
(C)NodeJS
(C)NodeJS
Jackson Tian
Mobile webapp&v5 html5_min
Mobile webapp&v5 html5_min
Jackson Tian
Nodejs异步原理和缺陷 - 赵成
Nodejs异步原理和缺陷 - 赵成
Jackson Tian
EventProxy introduction - JacksonTian
EventProxy introduction - JacksonTian
Jackson Tian
Mongoskin - Guilin
Mongoskin - Guilin
Jackson Tian
从无阻塞并行脚本加载(Lab.js)到浏览器消息模型
从无阻塞并行脚本加载(Lab.js)到浏览器消息模型
Jackson Tian
Why Nodejs Guilin Shanghai
Why Nodejs Guilin Shanghai
Jackson Tian
NodeJS快速服务端开发 朝沐金风 Shanghai
NodeJS快速服务端开发 朝沐金风 Shanghai
Jackson Tian
Ruby vs Node ShiningRay Shanghai
Ruby vs Node ShiningRay Shanghai
Jackson Tian
Más de Jackson Tian
(11)
D2_node在淘宝的应用实践_pdf版
D2_node在淘宝的应用实践_pdf版
D2_Node在淘宝的应用实践
D2_Node在淘宝的应用实践
(C)NodeJS
(C)NodeJS
Mobile webapp&v5 html5_min
Mobile webapp&v5 html5_min
Nodejs异步原理和缺陷 - 赵成
Nodejs异步原理和缺陷 - 赵成
EventProxy introduction - JacksonTian
EventProxy introduction - JacksonTian
Mongoskin - Guilin
Mongoskin - Guilin
从无阻塞并行脚本加载(Lab.js)到浏览器消息模型
从无阻塞并行脚本加载(Lab.js)到浏览器消息模型
Why Nodejs Guilin Shanghai
Why Nodejs Guilin Shanghai
NodeJS快速服务端开发 朝沐金风 Shanghai
NodeJS快速服务端开发 朝沐金风 Shanghai
Ruby vs Node ShiningRay Shanghai
Ruby vs Node ShiningRay Shanghai
MobileWebAppFramework_V5_design
1.
别样的Mobile Web框架 MOBILE WEB
APP框架(V5)设计
2.
About me @朴灵
非资深前端工程师一枚 就职于SAP Labs China 从事Mobile Web App开发 NodeJS痴迷者
3.
Agenda Mobile Web
App的问题与挑战 Mobile Web App框架(v5)设计 组件分解 生命周期 前端MVC变形 组件通信 对比jQuery Mobile V5的实践 Mobile Web App的兼容/适配问题
4.
单页面化(Single Page) 更好的体验,更小的带宽占用
HTML(布局/更新/回收/URL导航) 业务逻辑组织
5.
编程模型 前端MVC Programming
in Large 性能优化
6.
设备支持与限制 Tablet模式与Phone模式 设备差异问题
浏览器实现差异问题
7.
Mobile Web App设计与V5框架
Native App 向左 Web App往右
8.
真正的单HTML App
9.
视图到哪里去了?
10.
视图文件
11.
Viewport Viewport/Page Page(hidden)
Page Page(hidden) Page(hidden) (Initialize)
12.
Landscape
App Viewports View Columns Pages Views
13.
Page Module/生命周期
Initialize Destroy Shrink Page Reappear Page View Column
14.
Page Module/MVC
Section View Template L10N Resources Page Model Data from server Controller Open View Open Viewport
15.
前端MVC之M变形 Model
弃用Backbone.Model & Backbone.Collection 当封装是多余的时候,不封装是一种优化 Ajax同步后端数据 Underscore直接消费后端数据 Model依然存在
16.
前端MVC之V变形 View
DOM是个状态机 对Backbone.View做简单工厂封装 尽量采用事件委托 提升绑定性能 易于卸载 强烈反对过分封装HTML 设计过度 牺牲写HTML的乐趣 丢失HTML的灵活性
17.
工厂式View
18.
前端MVC之C变形 Controller/Router
弃用Backbone.Router / Controller URL hash的缺陷 信息量传递较少 URL前进/后退增加程序复杂度 Full Screen下无用武之地 我们的目标是App,Not page. 仅用于恢复视图 主动访问视图,触发视图生命周期
19.
主动式Contoller
20.
Page通信/消息
V5 Framework
21.
App Vs. jQuery
Mobile App(v5) jQuery Mobile Page Module (收敛式设计 JavaScript无约束 ) 手动式渲染(预留自定义 属性定义式渲染(少许自 UI机制) 定义均需修改核心代码) 生命周期管理 暂无 Localization 暂无 碎片式(组件)开发 原始Page式开发 视图消息机制 暂无(Pad场景下将会耦合)
22.
大规模编程问题
Module NameSpace Sandbox 约束 轻量 无侵 组合 碎片 式 级 入 式 式
23.
资深jQuery黑说$问题 $解决了 •
DOM操作的复杂性 • 跨浏览器的兼容问题 $遗留的问题 • 把$当锤子,当万能药(jQuery Plugin) • 灵活有余,收敛不足(得向YUI3学习啊) • 插件API丑陋 • 除了DOM与Ajax,余者不足以傲
24.
DOM优化
限定作用 事件委托应对 区间 组件式widget DOM更新问题 (Module) 限定查找 缓存DOM 范围 查找结果 (view.$, find)
25.
业务逻辑/复杂回调 复杂业务场景下回调引起的代码紊乱 回调函数嵌套问题
EventProxy.js Assign AssignAlways After N+1问题。N个bind+1个assign。 Module分割 + 上层规划(流程图)
26.
代码质量 JSLint JSDoc
Qunit CSSLint
27.
优化/编译 在解决Programming in
Large时,项目文件 通过Module分割成为了碎片 Mobile上的HTTP更昂贵 合并Templates 合并/压缩JavaScript 合并/压缩CSS 图片DataURI化 尽量用CSS3实现icon 离线程序 Nodejs在项目中扮演编译脚本的作用
28.
优化原则 模块式开发,合并式优化 不以最优为目的的开发,都是耍流氓
不伤及可维护性,可读性 分拆/独立/发散 组合/集成/收敛
29.
Web App问题 有谁懂从一个兼容各种浏览器(IE)的前端工
程师变成兼容Webkit的前端的寂寞 目前平台:iOS / Android 表现最佳平台为iOS,UI操作上几乎可以与 Native媲美 暂时理解为未来的趋势,最好的Mobile Web App 必定会是在iOS上产生的
30.
如何兼容各种Mobile浏览器 v5框架设计理念
消除掉工程师缺点的影响,而不是浏览器缺点 的影响 让工程师fix bug易,fix工程师的bug难 不做不擅长的事 让$处理DOM 让_处理数据操作 Ajax自个去通信,去同步 让iScroll控制触屏 让EventProxy 去处理回调
31.
坑爹的bug们 iOS上position:fixed问题 Android渲染性能问题
横屏的Viewport(Media queries) 屏幕适配问题 横竖屏orient change New Date(str)问题 离线模式下跨域Ajax问题 …
32.
究竟怎样兼容 在App(v5)框架的设计下,只有一个答案
那里不会,fix那里
33.
坑爹啊,不带这么偷懒的 到底怎么fix? 推荐支付宝颂赞的Mobile
Web开发技巧 http://qiqicartoon.com/?p=739 http://qiqicartoon.com/?p=877 http://qiqicartoon.com/?p=919
34.
35.
V5项目期望 成为一套轻量级的Mobile Web
App Solution 通过约束式编程,削减掉没有优秀工程师 带来的影响 项目地址: https://github.com/V5Framework/V5 期待您的参与和验证
Descargar ahora