專為webkit核心而生的javascript庫mango正式釋出

池中物willian發表於2013-08-22

Mango(芒果) javascript庫

求fork

https://github.com/willian12345/mango

什麼是mango

mango是以webkit為核心的瀏覽器專門編寫的javascript庫, api高仿jquery api

mango在BSD協議下開源釋出

為什麼會寫mango.js

因為webkit,現在越來越多的公司產品是用native程式包一個webkit核心用html5 來實現UI互動介面,而互動介面javascript又扮演著至關重要的角色。 Jquery幾乎成了大多數公司選擇的javascript庫,如果你作為一個jser連jquery都不會用,那你就別混了,親。

但是jquery並不是專門針對webkit的

jquery的包袱

jquery的特點就是write less do more併相容各型瀏覽器,這是偉大的創舉,同時也是其包袱,各種相容瀏覽器的程式碼,各種為了write less而發明的選擇器,方便我們程式人員的同時它卻是自己的包袱,這也至使其付出效能代價。

如果你的應用是安裝在移動端,或者是應用在硬體效能並不怎麼好的android裝置上,你就會關心jquery的效能問題了

mango放下了jquery的包袱

1、拋棄了各形瀏覽器相容的程式碼專為webkit核心的瀏覽器而寫;

2、直接使用了html5所原生支援的selector選擇器;

3、使用最新的html5 提供的api 最大可能提升效能;

4、提供與jquery 95%一至的api,減少學習成本;

mango是否是重複造輪子?

mango只是提供了與jquery api幾乎一至的api,但它卻是純為webkit而生的,也有別於zepto之類的javascript庫。Mango就是用來寫webkit核心的web app的,更純粹。

mango的效能

經過測試mango的api效能

全面超越jquery1.3、jquery1.7、jquery2.0、zepto、jq.mobi

自行選用mango的模組

根據web app的簡繁程度可以自由選擇mango所需要的模組來選擇mango檔案,達到最小化mango檔案


mango的模組及api

DOM模組

  • find
  • remove
  • empty
  • html
  • text
  • show
  • hide
  • siblings
  • add
  • addBack
  • end
  • closest
  • parents
  • parentsUntil
  • children
  • contents
  • eq
  • get
  • first
  • last
  • each
  • prop
  • removeProp
  • attr
  • removeAttr
  • val
  • data
  • parent
  • offset
  • css
  • has
  • is
  • filter
  • index
  • addClass
  • removeClass
  • toggleClass
  • hasClass
  • before
  • after
  • scrollLeft
  • scrollTop
  • append
  • appendTo
  • prepend
  • prependTo
  • next
  • nextAll
  • nextUntil
  • prev
  • prevall
  • prevUntil
  • width
  • innerWidth
  • outerWidth
  • height
  • innerHeight
  • outerHeight

Events模組

注:支援自定義事件及事件名稱空間 ,名稱空間以’/’符分隔

  • On
  • Off
  • Hover
  • Trigger
  • One

(各種快捷事件)

click,dblclick,focusout,mousedown,mousemove,mouseout,mouseover,mouseup, change,select, focus, blur, scroll, resize,submit,keydown,keypress,keyup,error

Ajax模組

  • $.ajax
  • $.getJson

靜態方法

  • $.extend
  • $.param
  • $.isArray
  • $.isBoolean
  • $.isDate
  • $.isNumber
  • $.isObject
  • $.isFunction
  • $.isRegExp
  • $.isString
  • $.each

Todo list

#ajax模組完善

#更多的靜態方法增加

#更多的jquery api

#完善Deferreds、Callbacks、Broadcast模組


如何使用

在html中引用mango

"mango.js"

接下來就可以像使用jquery一樣使用mango了

 

==========================================================================================

轉載處請註明:部落格園偷飯貓willian12345@126.com

相關文章