YUIConf2010 介绍 灵玉 2010-12-10
YUI 3 Performance (yui3 性能 ) Events Evolved ( 事件扩展 , 比如自定义事件 , 事件监听 , 组件应用等 ) Building YUI 3 Custom Modules ( 创建 yui3 客户端模...
YUIConf 2010 Sessions  An Introduction to YQL YQL + YUI: Building End-to-End Applications Building Open Data Tables with Y...
什么是 YQL ? ( Yahoo Query Language   ) YQL Console 实践中的 YQL YQL: An Introduction
YQL: An Introduction 应用程序 复杂数据源 多种数据格式 多个连接 多种 API 改变处理
YQL: An Introduction 唯一 API 规范 熟悉的 SQL 语法 插入 / 删除 / 修改 / 条件 / 过滤 / 排序 xml/json/csv 统一转换最终格式 让 YQL 优化查询 强壮的后台 Yahoo Query L...
show :  显示数据列表 desc :  描述数据列表的结构 select :  获取数据 insert/update/delete :  操作数据表 use :  应用一个开源数据表 set :  定义 key-values So wha...
select   Subject,Date  from  answers.getbycategory(0,5)  where  category_id=2115500137  and  type="resolved&q...
执行 YQL 查询的托管网站 快速设计和调试 default tables – 175 community tables – 772 all – 947 http://developer.yahoo.com/yql/console/ YQL C...
从 YQL Console 开始 YUI  +  YQL Use the YQL YUI module Use the DataSource.Get YUI module Use the YQL YUI Module with 2 legged...
Various console parameters /?debug=true  select * from html where url=http://yuiblog.com /?env=store://257Bv7SEAYewPfoOdKM...
Use the YQL YUI module
Use the YQLRequest Module http://developer.yahoo.com/yui/3/api/YQLRequest.html
Use the DataSource.Get  YUI modele
Use the YQL YUI Module with 2 legged OAuth http://developer.yahoo.com/yui/3/yql/
Building Open Data Tables  with YQL Execute Open Data Tables YQL Execute(JS API) YQL Storage
Open Data Tables – hello world
Open Data Tables – hello world http://developer.yahoo.com/yql/guide/yql-execute-examples.html# yql-execute-example-hellowo...
Using (Not Abusing) YQL  for Caching, Filtering and Collating Data 使用 YQL 不会浪费时间去学习 API 文档,是一个简单的工作。 在服务端过滤数据并且返回你需要的格式数据。...
Node.js + YUI 3 Node.js  是服务器端的  JavaScript  运行环境,它具有无阻塞 (non-blocking) 和事件驱动 (event-driven) 等的特色, Node.js  采用  V8  引擎,同样,...
Handling Data in YUI3 检索  Retrieval(Y.DataSource) 解析  Parsing (Y.DataSchema) 标准化  Normalization(Y.DataType) 显示  Display (w...
Handling Data in YUI3
Events
什么时候使用 跨多个组件共享数据 (Share data across widgets) 转化数据格式 (Transform data) 不可用在 YQL(When data is not available in YQL) Y.DataSou...
Introducing YUI 3 AutoComplete 模块化结构 提供 JSONP , YQL 使用很少的代码实现客户端结果数据的格式化 已经应用 YUI3.3.0 YUILibrary: http://yuilibrary.com/g...
High Performance JavaScript 减少缓慢的 js 加载 js 置于底部,合并 js ,动态 js ,延迟 js ,异步 js 减少执行缓慢的 js 不要让 js 执行超过 50ms ,分离过长的 js 进程 减少太多的 ...
Measuring the Web  With Boomerang 某个页面可感知的性能表现 - 考虑的是用户打开页面的那段时间 动态页面性能 用户带宽 组件加载时间 网络延迟 github : http://yahoo.github.com/...
Porting Flickr to YUI 3 解决延迟的 js 动态排队 解决很长的 combo-handler 算法 组件真的降低成本吗 ? Y.delegate() 和 Y.on() 轮询,建议使用 Y.all().on() Ie6/ie...
Panel Discussion:  "The Future of Web Development" JavaScript 已经成为在世界上最重要的编程语言 CSS 也是不可撼动的一部分 (CSS grid ...
Thanks!
YUIconf2010介绍
YUIconf2010介绍
Upcoming SlideShare
Loading in …5
×

YUIconf2010介绍

1,315 views
1,267 views

Published on

0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
1,315
On SlideShare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
9
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

YUIconf2010介绍

  1. 1. YUIConf2010 介绍 灵玉 2010-12-10
  2. 2. YUI 3 Performance (yui3 性能 ) Events Evolved ( 事件扩展 , 比如自定义事件 , 事件监听 , 组件应用等 ) Building YUI 3 Custom Modules ( 创建 yui3 客户端模块 , 如支持多个配置对象 , 自定义模块 ,user.add()) Creating Beautiful Documentation with YUI Doc(YUI Doc 的 ant build 脚本 ) Automated Integration Testing with YUITest Keynote The YUI 3 roadmap The widget infrastructure YUIConf2009 回顾
  3. 3. YUIConf 2010 Sessions An Introduction to YQL YQL + YUI: Building End-to-End Applications Building Open Data Tables with YQL Execute Using (Not Abusing) YQL Introducing YUI 3 AutoComplete Handling Data in YUI 3 High Performance JavaScript and much, much more!
  4. 4. 什么是 YQL ? ( Yahoo Query Language ) YQL Console 实践中的 YQL YQL: An Introduction
  5. 5. YQL: An Introduction 应用程序 复杂数据源 多种数据格式 多个连接 多种 API 改变处理
  6. 6. YQL: An Introduction 唯一 API 规范 熟悉的 SQL 语法 插入 / 删除 / 修改 / 条件 / 过滤 / 排序 xml/json/csv 统一转换最终格式 让 YQL 优化查询 强壮的后台 Yahoo Query Language
  7. 7. show : 显示数据列表 desc : 描述数据列表的结构 select : 获取数据 insert/update/delete : 操作数据表 use : 应用一个开源数据表 set : 定义 key-values So what can YQL do?
  8. 8. select Subject,Date from answers.getbycategory(0,5) where category_id=2115500137 and type="resolved" limit 5 YQL: fetches data 过滤、分页、字段 通过数据源连接 select * from weather.forecast where location in ( select id from xml where url="http://xoap.weather.com/search/search?where=prague" and itemPath="search.loc") 查询后的操作 (sort/ unique/…) select * from social.profile where guid in (select guid from social.connections where owner_guid=me) | sort (field="nickname")
  9. 9. 执行 YQL 查询的托管网站 快速设计和调试 default tables – 175 community tables – 772 all – 947 http://developer.yahoo.com/yql/console/ YQL Console
  10. 10. 从 YQL Console 开始 YUI + YQL Use the YQL YUI module Use the DataSource.Get YUI module Use the YQL YUI Module with 2 legged OAuth YQL + YUI: Building End-to-End Applications
  11. 11. Various console parameters /?debug=true select * from html where url=http://yuiblog.com /?env=store://257Bv7SEAYewPfoOdKMEvB select * from netflix.catalog where term = "breaking away" /?_uiFocus=flickr select * from flickr.photos.interestingness(20)
  12. 12. Use the YQL YUI module
  13. 13. Use the YQLRequest Module http://developer.yahoo.com/yui/3/api/YQLRequest.html
  14. 14. Use the DataSource.Get YUI modele
  15. 15. Use the YQL YUI Module with 2 legged OAuth http://developer.yahoo.com/yui/3/yql/
  16. 16. Building Open Data Tables with YQL Execute Open Data Tables YQL Execute(JS API) YQL Storage
  17. 17. Open Data Tables – hello world
  18. 18. Open Data Tables – hello world http://developer.yahoo.com/yql/guide/yql-execute-examples.html# yql-execute-example-helloworld
  19. 19. Using (Not Abusing) YQL for Caching, Filtering and Collating Data 使用 YQL 不会浪费时间去学习 API 文档,是一个简单的工作。 在服务端过滤数据并且返回你需要的格式数据。 使用快速的 YQL 服务可以省掉大量的需求 写你自己的 JS APIs 用以执行 使用本地存储并且不要丢掉缓存 去做简单的效果
  20. 20. Node.js + YUI 3 Node.js 是服务器端的 JavaScript 运行环境,它具有无阻塞 (non-blocking) 和事件驱动 (event-driven) 等的特色, Node.js 采用 V8 引擎,同样, Node.js 实现了类似 Apache 和 nginx 的 web 服务,让你可以通过它来搭建基于 JavaScript 的 Web App 。 http://www.douban.com/group/node.js/ http://wiki.ued.taobao.net/doku.php?id=ued.bj:f2e:share2010#nodejs_ 实践 _ 拔赤
  21. 21. Handling Data in YUI3 检索 Retrieval(Y.DataSource) 解析 Parsing (Y.DataSchema) 标准化 Normalization(Y.DataType) 显示 Display (widgets)
  22. 22. Handling Data in YUI3
  23. 23. Events
  24. 24. 什么时候使用 跨多个组件共享数据 (Share data across widgets) 转化数据格式 (Transform data) 不可用在 YQL(When data is not available in YQL) Y.DataSource 不控制输入数据 (No control of incoming data) 转换成 json(Want to turn data to JSON) 前后端不依赖 (Ensure Front-end codeless reliant) Y.DataSchema Y.DataType 数据格式间的转换 (Formatting)
  25. 25. Introducing YUI 3 AutoComplete 模块化结构 提供 JSONP , YQL 使用很少的代码实现客户端结果数据的格式化 已经应用 YUI3.3.0 YUILibrary: http://yuilibrary.com/gallery/show/autocomplete
  26. 26. High Performance JavaScript 减少缓慢的 js 加载 js 置于底部,合并 js ,动态 js ,延迟 js ,异步 js 减少执行缓慢的 js 不要让 js 执行超过 50ms ,分离过长的 js 进程 减少太多的 UI 渲染 先把 DOM 移除,更改后重新添加, display : none , DocumentFragment
  27. 27. Measuring the Web With Boomerang 某个页面可感知的性能表现 - 考虑的是用户打开页面的那段时间 动态页面性能 用户带宽 组件加载时间 网络延迟 github : http://yahoo.github.com/boomerang/doc/ https://github.com/yahoo/boomerang/tree/gh-pages
  28. 28. Porting Flickr to YUI 3 解决延迟的 js 动态排队 解决很长的 combo-handler 算法 组件真的降低成本吗 ? Y.delegate() 和 Y.on() 轮询,建议使用 Y.all().on() Ie6/ie7 滚动不稳定 深入的挖掘 js 文档库
  29. 29. Panel Discussion: "The Future of Web Development" JavaScript 已经成为在世界上最重要的编程语言 CSS 也是不可撼动的一部分 (CSS grid and CSS layout ) node.js 服务器与浏览器共享代码的愿景
  30. 30. Thanks!

×