首页 > 编程语言 >JavaScript(06): 优秀JavaScript库概览

JavaScript(06): 优秀JavaScript库概览

时间:2023-06-20 13:05:10浏览次数:53  
标签:jQuery 06 JavaScript 概览 API UI 组件 文档


jQuery

设计思想

简洁的思想:几乎所有操作都是以选择DOM元素(有强大的Selector)开始,然后是对其的操作(Chaining等特性)。

优点

  • 小,压缩后代码只有20多k(无压缩代码94k)。
  • Selector和DOM操作的方便.
  • Chaining:总是返回一个jQuery对象,可以连续操作。
  • 文档的完整,易用性(每个API都有完整的例子,这是其它框架现在不能比的),而且网上还有很多其它的文档,书籍。
  • 应用的广泛,包括google code,drupalwordpress

缺点

由于设计思想是追求高效和简洁,没有面向对象的扩展。设计思路和MooTools不一样。CSS Selector的速度稍微有些慢(但是现在速度已经大幅提高).

Mootools

设计思想

面向对象的设计思想。

优点

  • 模块化,各模块代码非常独立,最小的核心只有8k,最大的优点是可选择使用哪些模块,用的时候只导入使用的模块即可,完整的也不到180k(没有压缩),压缩后不到70k。
  • 语法的简洁,直观;代码写的优美,易阅读和修改。
  • 特效,这一点比jQuery稍强,现在也正在开发Mootools UI(这应该是Ajax框架开发的一个趋势)。

缺点

  • 修改了低层的一些类:如Array, String等,这也是设计思想的不同.
  • 在DOM和CSS Selector上不如jQuery强大。

Dojo

优点

  • 背后强大的支持:IBMSun、等,这是非常重要的优势。
  • 功能的强大,Full Stack的框架,扩展了DHTML的能力,例如:支持与浏览器Back/Forward按钮的集成。
  • Dojo Offline,一个跨平台的离线存储API。
  • Chart组件,可以方便地在浏览器端生成图表。
  • 基于SVG/VML的矢量图形库。
  • Google Maps、Yahoo! Maps组件,方便开发Mashup应用。

Comet支持,通过通用的Buyeux协议。

  • 强大的UI(Dijit)。
  • 面向对象的设计,统一的命名空间,包管理机制、可扩展性。

缺点

  • 复杂,学习曲线陡。
  • 文档的极端不全,这是一个很大的问题。
  • API很多不稳定,各版本间改动较大,现在还不是一个成熟的框架。
  • 侵入性太大,页面中大量使用dojo的属性,例如<button dojoType="dijit.form.Button" id="helloButton">,如果将来dojo升级或者换一个框架时,负担会很大。

性能问题,由于dojo加载采用了同步的机制,会暂时锁定浏览器,导致CPU使用率达到100%。另外,很多Widget的速度很慢。

Ext JS

设计思想

组件化,推进RIA的应用。

优点

  • 强大的UI,而且性能不错,这是其最大的优点。
  • 速度快,管是UI还是其它模块。
  • 100%面向对象和组件化的思想,一致的语法,全局的命名空间。
  • 文档的完整,规范,方便。
  • 模块化实现,可扩展性强。
  • 所有的组件(widgets)都可直接使用,而无需进行设置(当然,用户可以选择重新配置)。

缺点

  • 稍复杂。
  • 为重量级的框架(包含大量UI),体积大。如果导入ext-all.js,压缩后也有近500k。

注意:EXT的商业使用:如果只是把extjs包含在自己的项目中,而且这个项目不是卖给用户做二次开发的工具箱,或组件库,就可以遵守LGPL协议免费使用;否则要付费。

除此之外,在早期的开发中大家可能会使用过Prototype,不能否认Prototype也是一个优秀的JavaScript库,它致力于改善JavaScript的可用性,添加了许多被JavaScript遗忘的特性;还有就是YUI,Yahoo!开发的直到现在仍然可以用来构造Web UI的优秀的库。如果仔细的想想,一个优秀的JavaScript库应该具备哪些特征呢?可能应该包含以下几个方面的内容:

1. 核心功能

    - DOM

    - 事件

    - Ajax

    - 动画

    - 用户界面插件 


2. 开发


- 良好的架构

- 开放授权

- 广泛的浏览器支持

- 较小的压缩文件 

此外,代码应当存放在开放的SVN中,能够进行Bug跟踪,并且经过良好的单元测试,完整的API文档和大量的教程,丰富的演示例子。

下面的链接地址是一个关于jQuery的讲义,希望对想了解jQuery的同学有所帮助。


标签:jQuery,06,JavaScript,概览,API,UI,组件,文档
From: https://blog.51cto.com/u_16166070/6521802

相关文章

  • 云服务器使用记录-20230620
    三丰云免费云服务器确实是一款值得推荐的云计算服务。它提供了多种类型和多线程的服务,同时也提供高性能、高安全性和高稳定性的云计算服务,非常适合广大用户的需求。使用虚拟主机可以帮助您轻松地管理您的网站和应用程序,并且在处理高流量时具有更好的性能和稳定性。此外,三丰云还提供......
  • JavaScript(03): 面向对象
    面向对象的开发方式是目前软件开发的主流方式,JavaScript也是面向对象事件驱动的编程语言,如果能够掌握JavaScript的面向对象编程的知识,就有了构建自己的JavaScript库的基础和前提。1.面向对象的基本概念对于熟悉Java或者C#的开发者来说,面向对象的概念以及封装、继承、多态等名词应......
  • JavaScript(07): 实例2---网页广告漂浮效果(面向对象版)
    在上一个版本的基础上使用JavaScript的面向对象完成,为了不影响阅读,去掉了随滚动条移动的广告<!DOCTYPEhtml><html> <head> <title>Example</title> <metahttp-equiv="content-type"content="text/html;charset=GBK"/> <linktype="......
  • JavaScript(07): 实例3---Google Eye
    下面的例子源于GoogleEye(如下图所示的效果),通过这个例子可以好好体会一下JavaScript的面向对象编程。<!DOCTYPEhtml><html> <head> <title>GoogleEye</title> <metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/> <st......
  • JavaScript的对象深度克隆
    Object.prototype.clone=function(){ varnewObj={}; for(variinthis){ if(typeof(this[i])=="object"||typeof(this[i])=="function"){ newObj[i]=this[i].clone(); } else{ newObj[i]=this[i]; } } r......
  • 虚拟主机使用记录-20230620
    三丰云提供的免费虚拟主机和免费云服务器对于学生和初学者来说非常有吸引力,并且易于使用。同时,三丰云也提供付费计划,可以为更高级别的用户提供更多资源和功能支持。需要注意的是,免费服务通常会受到一些限制和局限性。因此,在选择免费主机或云服务器时,需要根据实际需求进行评估,以确保......
  • JavaScript学习 -- 对象的属性描述对象
    一、声明一个对象let对象={name:"公众号:编程有你",pwd:123456};二、输出对象属性的描述//console.log(Object.getOwnPropertyDescriptors(对象))获取多有属性console.log(Object.getOwnPropertyDescriptor(对象,'name'))获取指定的属性三、运行结果:writable:true, ......
  • JavaScript 指定格式化日期的方式
    JavaScript指定格式化日期的方式1、使用let和const的方式functionformatDate(date,format){constmap={"M":date.getMonth()+1,//月份"d":date.getDate(),//日"h":date.getHours(),//小时"m":date.getMinut......
  • 从零开始学Python第06课:循环结构
    我们在写程序的时候,极有可能遇到需要重复执行某条指令或某些指令的场景,例如我们需要每隔1秒钟在屏幕上输出一次“hello,world”并持续输出一个小时。如下所示的代码可以完成一次这样的操作,如果要持续输出一个小时,我们就需要把这段代码写3600遍,你愿意这么做吗?importtimeprint('h......
  • 2023-06-20 TypeError: Cannot use 'in' operator to search for 'storeInfo' in unde
    前言:uniapp项目报错:[system]TypeError:Cannotuse'in'operatortosearchfor'storeInfo'inundefined原因:data里面没有写return,如下:<script>exportdefault{data(){},}</script>解决方案:把return加上,即:<script>expo......