kissy 是淘宝一个开源的 JavaScript 库,包含的组件有:日历、图片放大镜、卡片切换、弹出窗口、输入建议等

距离 KISSY 1.2.0 发布已过一年,自 KISSY 1.3rc 发布后,1.3 又继续经历了即将发布的店铺系统,搜索系统,商品详情系统的锤炼,并做了必要的调整和优化。今天终于可以高兴地宣布: KISSY 1.3.0 正式版发布了。你可以通过淘宝 cdn 在线引用(推荐)或者直接从 github 下载 或者使用 npm 安装.官网文档也进行了相应更新,覆盖了 1.3 涉及到的新特性以及修改,请清除缓存后访问 KISSY 1.3 文档首页.

下面简单介绍下 1.3.0 相对于 1.2.0 的新特性与不兼容之处,也可查看 发布 ppt 介绍.

改进:

前提

  • 不要静态引入 KISSY 模块文件,例如

    <script src='http://a.tbcdn.cn/s/kissy/1.3.0/overlay.js'></script>
    
  • 推荐只静态引入 seed-min.js,通过 use require 使用其他模块,另外:

    • 尽量少 use
    • 线上设置 combo 模式(需要服务器支持 combo )

稳定性提升

  • 使用 phantomjs travis nodejs 来支持 KISSY 的持续集成。
  • 单元测试覆盖率提升,目测 80% 左右,后面需精确统计.

协作效率提升

  • package 机制支持多个业务间的无缝协作
  • combo 模式支持每个业务耗费最小的链接数,后面会继续优化业务间的链接数
  • 内置 gallery package,更容易的通用模块共享机制,引用 cdn 版本直接 use(‘gallery/xx’) 即可。

开发更便捷

  • 线上 combo 模式与开发阶段匿名模块的无缝切换
  • 组件加强了一致性
    • 对外 api: new/render/plugin/listeners
    • 生命周期事件: afterRenderUI/afterBindUI/destroy/show/hide
    • 组件即模块, use/require 按需使用
  • 组件通过 json 初始化达到更好的易用性

    new Menu({children:[{content:'menuitem'}],plugins:[],listeners:[]
    });new Tree({content:'root',children:[{content:'node'}]
    });
    
  • 增加新的模块:promise,uri,stylesheet,combobox,color,swf,xtemplate

  • KISSY 新的英文 api 文档

性能与可访问性

  • 移动支持

    • 所有模块按照设备能力按需加载
    • 线上启用 combo 模式减少链接数
    • 支持手势事件 pinch, rotate, tap ….
    • 大部分组件支持触屏下使用
  • 性能

    • 部分模块选择性加载,例如 ie 的兼容性模块( json2/event hashchange/dom ie… )不会被标准浏览器加载
    • 通过延迟初始化,提高了层级组件的性能.

不兼容处

  • 删除了 KISSY.app 方法,移除了 csspath/cssfullpath/path/fullpath 配置,请使用 1.3 推荐的 模块化机制 .

  • KISSY.add(name, fn), fn 只有在 use 或者 require name 时执行。请需要对应模块功能时要 use 或者 require

  • suggest/template/flash/validation 移到了 gallery。使用的话请修改模块名字:gallery/suggest/1.0/,gallery/template/1.0/,gallery/validation/1.0/,gallery/flash/1.0/.

  • dd 的代理和监控滚动功能独立为单独的模块:dd/pplugin/proxy,dd/plugin/scroll,
    使用方式也改为统一的插件 api:

    new Draggable().plug(new ProxyPlugin())
    // or
    new Draggable({plugins: [new ProxyPlugin()]
    })
    
  • overlay 的 resize 和 draggable 功能也独立为单独的模块:component/plugin/drag,component/plugin/resize,使用方式也改为统一的插件 api:

    new Overlay().plug(new DragPlugin());
    // or
    new Overlay({plugins:[new DragPlugin()]
    });
    
  • editor 重构

    • 使用统一的组件 api 与模块化机制

详细 changelog

详细 changelog 可到文档页面具体查看。

1.3 修复的 bug 可到 github issues 里查阅.

next -> 1.4

下个版本中初步规划在两个方面完善:

  • 基础架构

    • test coverage
    • ie 持续集成探索??
    • 链接数继续优化
    • 快速的 build 机制探索
  • 基础组件

    • date/datasource/graphic
    • 无缝加载的 css 选择器
    • data-picker
    • color-picker
    • switchable 重构
    • grid??

具体 roadmap 有兴趣可关注 github

下载地址:https://github.com/kissyteam/kissy/archive/1.3.0.zip

转载于:https://www.cnblogs.com/dushu/archive/2012/12/27/2835186.html

KISSY 1.3.0 发布,淘宝 Web UI 库相关推荐

  1. 2023 年大淘宝 Web 端技术概览

    本文介绍了大淘宝 Web 领域的工程师们正在做哪些技术工作.有什么技术产品. 背景 2022 年,大淘宝前端团队进行了调整:重新组织生产关系,按业务线拆分整合进对应的业务技术团队,同时保留了大前端虚线 ...

  2. 从踩坑到填坑|淘宝Web 3D应用与游戏开发实战

    导读:本文是淘宝前端技术专家--徐乾伟(烧鹅)分享的淘宝 Web 3D 应用与游戏开发实战,这个话题在业界被谈及得比较少.今天将会从移动.3D.游戏三种交叉的话题来和大家探讨.接下来和小编一起从初试 ...

  3. h5 淘宝web登录注册1:1还原响应式页面源码

    可算把淘宝web版本的登录注册页面 1:1的复制过来了,效果图如下 1.账号密码登录 2.短信验证码登录 3.账号注册 废话不多说,直接开分享源码. 本次源码仅有html和css,js写在html文件 ...

  4. 短信验证登录淘宝web页面(selenium+Chromedriver)

    短信验证登录淘宝web页面 自动化模拟登录(chromedriver存在python环境里) 第一步进行导包 第二步定位获取页面的web源代码 第三步构造是以chrome浏览器登录而不是以seleni ...

  5. “四核”驱动的“三维”导航 -- 淘宝新UI(需求分析篇)

    "四核"驱动的"三维"导航 -- 淘宝新UI(需求分析篇) 原文:"四核"驱动的"三维"导航 -- 淘宝新UI(需求分析 ...

  6. Android仿淘宝首页UI(附代源代码及示例图片)

    Android仿淘宝首页UI(附代源代码及示例图片) 可以收获 运行出来的效果 部分代码 源代码 可以收获 更改Layout中的文字和drawble中的图片即可生成适应于不同情景的APP,帮助开发者完 ...

  7. 淘宝网商品库优化实践访谈

    余锋先生您好.欢迎您参加QCon0:04并给我们做精彩的演讲.也谢谢您接受我们的采访.您能向观众朋友大概介绍一下您自己,包括您现在负责的具体工作是什么吗? 大家好,我隶属于淘宝网核心系统数据库组.我们 ...

  8. 四核驱动的三维导航—淘宝新UI(设计篇)

    前面有一篇博客说到了淘宝UWP的"四核驱动的三维导航-淘宝新UI(需求分析篇)",花了两周的时间实现了这个框架,然后又陆陆续续用了三周的时间完善它. 多窗口导航,与传统的导航方式的 ...

  9. 15 个 JavaScript Web UI 库

    新闻来源:speckboy.com 几乎所有的富 Web 应用都基于一个或多个 Web UI 库或框架,这些 UI 库与框架极大地简化了开发进程,并带来一致,可靠,以及高度交互性的用户界面.本文介绍了 ...

最新文章

  1. 阿里开发者招聘节 | 面试题14:如何实现两金额数据相加(最多小数点两位)...
  2. 给妹子讲python-S01E15详解python迭代环境
  3. CKEditor+CKFinder配置学习
  4. python-9-IO编程
  5. 用什么擦地最干净脑筋急转弯_脑筋急转弯:手机的反义词是什么?答案让人笑得肚子疼!...
  6. DataGridView中回车键的妙用
  7. 美容觉是几点到几点?
  8. HOT!闲来无聊,总结了下10个作为网民不得不知道的网址
  9. 学起来 —— CSS 入门基础
  10. SpringSession实现用户会话
  11. 绿色版本Tomcat
  12. 使用 jQuery Mobile 与 HTML5 开发 Web App (五) —— jQuery Mobile 表单下
  13. Spring Boot 实现微信小程序订阅模板消息
  14. SpringBoot中注册Servlet三大组件
  15. 用R3写卡成PRL302,解决新电信卡PRL301只能1X不能上3G问题
  16. java 异常_23、Java异常分类
  17. Invest授粉模型问题求助
  18. iTop-4412精英版的u-boot-2017.11移植教程(二)
  19. 加速应用开发 | Firebase Summit 2021 精彩回顾
  20. 求图形的周长和面积java_抽象类求图形周长和面积

热门文章

  1. 查询SAP HR薪资j计提和发放过账的HR 凭证及其对应的FI凭证-PCP0 / PC00_M99_CIPE
  2. Oracle查询相关
  3. linux新硬盘挂载
  4. 让别人夸赞你的 JS 写得漂亮
  5. Java实训(181110~181111)
  6. 使用工具Cronolog进行日志分隔
  7. CG插画入门教程之人体动态基础与面部画法分析
  8. LIN总线物理层介绍之总线特性
  9. YaliEditor的主题风格的制作流程
  10. HTML-CSS基础笔记