jQuery getting too big?
The primary goal of this project would be for the feedback/demand to kickstart jquery.com into re-organizing its code-base so it's more modular since we believe we've proved the most useful parts of jQuery is a fraction of its code-base.
To this end, follow this project if you want jquery.com to measure the demand for this. Another project with similar goals is http://ender.no.de/ - for node.js. JSLim is another project that takes a novel approach to reducing code size with advanced minification techniques.
Zepto.js is another great alternative to jQuery, it's fast, light and optimized for mobile/webkit browsers. It's a popular option for PhoneGap developers with full support for the
Backbone.js, Underscore.js and Spine.js frameworks. It has very recently added support for the latest Safari, Chrome, Firefox and Opera browsers - it makes use of latest EcmaScript 5 APIs without shims so if this is your targetted market, we encourage you to try it.
Based on recent posts it does looks like jQuery wants to build a slimmer jQuery. Although we don't think giving a trim is going far enough, we hope they perform larger re-structural changes allowing us to use most of the useful parts at a fraction of their cost. Their recent conversations into future file size reduction do sound promising.
Introducing jquip - aka jQuery-in-parts.
Smaller, Lighter, Faster, more modular jQuery - include only the parts you want! Don't use it, Don't include it.
Minified & gzipped code sizes (v.03):
- jquip.js (6.6k)
- jquip.events.js (1k)
- jquip.docready.js (.5k)
- jquip.css.js (2.5k)
- jquip.ajax.js (1k)
Query Engine options (not required for modern browsers)
- jquip.q-min.js (.6k) - An extremely fast but limited query engine (see below)
- jquip.q-qwery.js (2.6k) - A New fast replacement for Sizzle.js
- jquip.q-sizzle.js (5.29k) - Sizzle.js
The core jquip.js is only 6.6KB (minified and gzipped) - a fraction of the size of jQuery.
Has 90% of the good parts of jQuery (rest to be added plugins as needed), small enough to drop-in as source saving an external js reference.
Automatically downloads parts needed for older browsers
Sizzle.js is only added on demand (if it's not already included) from cdnjs.com for browsers that need it (i.e. <=IE7) as we believe it's the optimal way to download shims for browsers that need it.
Most code has been ported from jQuery or Zepto.js and optimized where possible, e.g. internals use underscore's native _.each over jquery's slower $.each etc.
Licence: http://www.opensource.org/licenses/mit-license.php (Same as jQuery and Zepto.js)
The jquip Simple Demo is also available to try online, whilst a version compiled with Google's Closure Library (Advanced mode) is in the repo.
Disclaimer
This is NOT an official jQuery.com project.
Code-base will now be more stable as we've reached our goal of jquip.js (with the events + docready plugins) working in Backbone.js, there are likely a few fixes still to be added but the core is close to feature complete and wont require the major refactoring done recently.
We would still like to hear feedback on issues/non-implemented core functionality so we can measure the API popularity of missing pieces.
News
v.03.1
- Fixed
$().html method to support DOM elements (for Backbone and other libraries)
v.03
- Intended to be last code change to significantly effect the size and API in the core jquip.js
$.loadAsync(url,cb) script loader added to load plugin and user scripts on demand- For older browsers that don't have querySelector support, Sizzle.js is downloaded on demand from cdnjs.com
- If the ajax plugin is included and browser doesn't have JSON, it is also downloaded from cdnjs.com
- When all scripts loaded the callbacks registered in
$.scriptsLoaded and $(callback) are fired
- Although if docready plugin is installed,
$(callback) is only called on DOMContentLoaded
- Modern browsers won't need additional downloads, so
$(callback) fires straight away or after any user scripts are loaded with $.loadAsync
- Added Expr support with :hidden and :visible baked in. Further :expression support can be plugged in by extending
$.Expr
- In addition to :expr's, filtering can also be #id, tagName, .className or [attr=value]
$().is, $().not, $().filter and $().find take advantage of the above filtering + Expr support
$().show, $().hide and $().toggle improved. With css plugin it behaves like jQuery,
without, it only checks the visibility of selected elements- css plugin improved to report correct dimensions on Height/Width/Left/Top methods
- Remaining Advanced Closure issues resolved (ie tests pass in both) should be safe to compile jquip.js and plugins
v.02
- We now are able to compile in Closure Compiler's advanced compilation mode!
The minified output passes Backbone.js test suite and reports only 1 not implemented feature in Spine.js tests. We still have Closure Compiler warnings as a result of un-annotated methods which we'll look at adding in the near future.
- The source code was modified (somewhat unnaturally) so it would work with the Closure Compiler, i.e. have all the API methods exported correctly.
- The total code-size (min+gzip) for jquip and non-query plugins (i.e. docready,events,css,ajax,custom) is 9.67k in advanced mode and 9.86k in Simple mode.
v.01
- Abstracted Events, pluggable query engines and new
$().find and Events system courtesy of the much leaner implementation in Zepto.js, refactored to support multiple browsers.
- We are now passing Backbone.js latest test-suite in all the latest browsers! Now included in the /test folder.
- New Spine.js tests added as well, now passing all but 1 test (in latest browsers)
- (we'll get to older IE browsers as soon as we find a PC with them installed :)
- New Event system added as a plugin, now with abstracted events.
- We expect most devs would want to include events, but can now be stripped if you dont.
- Query engines are now pluggable and none are included by default but will auto detect window.Sizzle or window.qwery if available and automatically download Sizzle.js from cdnjs.com if a browser doesn't support
document.querySelectorAll (i.e. <=IE7). Note: because there's no Sizzle.js it's important to be aware of limitations when relying on browsers native querySelector implementations, i.e. there are restrictions in IE8 where the HTML page must be in standards mode and Safari in quirks mode can't handle uppercase or unicode characters.
pre-alpha, first release
- Customizable Library builder service at
- Node js build scripts added to minify jquip with UglifyJS.
- $.addConstructor is now
$.hook
- $.addPlugin is now
$.plug
- scrollLeft and scrollTop is now in the css plugin
- Due to a request by the jQuery team we're no longer assigning the jQuery variable, you will now need to manually change this yourself on the first line of jquip.js:
window.jquip = window.$ = (function()..
Roadmap
- Getting jquip to work in Google Closure Compiler's advanced compilation mode without warnings so it can be used to programatically strip out dead code your application doesn't use for an even smaller footprint!
- Add the Closure Advanced Compiler option to the jquip library service
- Add missing shims to Abstracted Events (decided to add them after all due to popular demand)
- Add caching to improve performance
What's in the box? - i.e. the 90% good parts
Methods marked with * are only partially implemented.
- $(selector)
- $(selector, context), $(element), $(array)
- $(callback) requires docready plugin.
Methods operating on a $(selctor)
- add
- each
- attr
- removeAttr
- get
- toArray
- data
- append
- appendTo
- prepend
- prependTo
- before
- insertBefore
- after
- insertAfter
- toggle
- hide
- show
- fadeIn and fadeOut - does so without animation, consider using jquery.animate-enhanced plugin*
- eq
- first
- last
- indexOf
- slice
- find*
- not*
- filter*
- is*
- remove
- closest
- val* - does not do checkbox, select, etc.
- html
- text
- empty
- addClass
- removeClass
- hasClass
- parent
- parents
- parentsUntil
- next
- prev
- nextAll
- nextUntil
- prevUntil
- siblings
- children
- contents
- serializeArray
static methods off $
- $$ - querySelectorAll or query engine shim
- $.each
- $._each - Underscore's native each
- $._indexOf - Underscore's indexOf
- $._defaults - Underscore's defaults
- $._filter - Underscore's filter
- $.Expr - :hidden :visible now supported, can plugin other expressions as needed.
- $.filter
- $.dir
- $.nth
- $.sibling
- $.grep
- $.map
- $.data
- $.attrs
- $.trim
- $.isFunction
- $.isArray
- $.isWindow
- $.isNaN
- $.merge
- $.extend
- $.makeArray
- $.hasClass
- $.typeOf - safe type of a variable
- $.loadScript - (url, callback [, async]) load an external script dynamically
- $.loadAsync - load js async and call
$(callback) or $.scriptsLoaded when all scripts have been loaded
- $.scriptsLoaded - register callbacks to be fired when all async scripts have been loaded.
- $.htmlFrag - creates a document fragment from a html string (name changed)
- $.walk - traveres all childElems including self
(predicateFn, [[, context], results])
- $.query - query Engine i.r. doc.querySelector || queryEngine Shim
- $.attrs - an elements attributes
- $.unique - return a unique list of elements in document order
- $.contains - parent element contains sibling
Plugins
Pick and choose the parts of jQuery when and add you use them.
Other parts of jQuery can be Added via Plugins which is simply a matter of copying or including the
script after the core jquip.js.