Comparison of JavaScript-based web frameworks
From Wikipedia, the free encyclopedia
This is a comparison of web frameworks for front-end web development that are reliant on JavaScript code for their behavior.
 | This article needs to be updated. The reason given is: Does not reflect newer libraries or versions made available in the last several years. (April 2017) |
General information
Summarize
Perspective
| Framework | Version compared |
Size | License | Source language |
|---|---|---|---|---|
| Angular | 14.0.4 29 June 2022 |
563 kB (minified & compressed) | MIT | TypeScript |
| AngularJS | 1.5.0 5 Feb 2016 |
144 kB (minified & compressed) | MIT | JavaScript |
| Apache Royale | 0.9.4 5 Nov 2018 |
19 kB (zipped) | Apache | ActionScript 3, MXML, CSS |
| Backbone.js | 1.2.1 June 2015 |
7.3 kB (Packed and gzipped) | MIT | JavaScript |
| Dojo | 1.10.4 18 Jan 2015 |
Variable. Base size: 41 kB (minified & gzipped), 155 kB (minified), 598 kB (uncompressed)[1] |
BSD & AFL | JavaScript + HTML |
| Ember.js | 1.7.0 19 Aug 2014 |
95 kB (minified & gzipped), 340 kB (minified), 1.5 MB (uncompressed) |
MIT | JavaScript |
| Enyo | 2.0.1 30 Aug 2012 |
<25 kB (core gzipped) | Apache 2[2] | JavaScript |
| Ext JS | 7.3 15 Sept, 2020 |
84–502 kB | GPL & Commercial[3] | JavaScript |
| Google Web Toolkit | 2.10.0 June 2022 |
Variable | Apache | Java |
| jQuery (library) | 3.6.0 3 Mar 2021 |
70.7KB (slim, minified), 87.4KB (minified),[4] 282 KiB (uncompressed)[4] |
MIT | JavaScript |
| jQWidgets | 3.9.1 29 Oct 2015 |
3102 KB (minified), 7486 KB (uncompressed) |
Creative Commons Attribution-NonCommercial 3.0 and Commercial[5] | JavaScript, HTML, CSS |
| Knockout | 3.5.0 22 February 2019 |
66.4 KB minified / 309 KB (development mode) | MIT | JavaScript |
| MooTools | 1.6.0 14 Jan 2016 |
Variable; 7.3–65 KiB (YUI Compressor),[6]
|
MIT | JavaScript |
| Prototype & script. aculo.us[9] | Prototype: 1.7.3 22 Sep 2015 script.aculo.us: 1.9.0 23 Dec 2010 |
46–278 kB | MIT | JavaScript |
| qooxdoo | 5.0.1 15 Sep 2015 |
Variable, starting at 6 kB (gzipped) | LGPL & EPL | JavaScript |
| React | 18.2.0 14 June 2022 |
react.production.min.js 6.41KB react-dom.production.min.js 92.4KB Total: 98.81KB |
MIT | JavaScript / TypeScript |
| SAP OpenUI5 | 1.102.1 15 Jun 2022 |
Variable, starting at 213 kB (gzipped) | Apache 2[10] | JavaScript |
| SproutCore | 1.11.2 2 May 2016 |
250–700 kB (gzipped). | MIT | JavaScript |
| Svelte | 3.12.1 14 Oct 2019 |
Variable | MIT | JavaScript |
| Vue.js | 2.6.10 20 Mar 2019 |
33.5 KB (minified & gzipped)
91.48 KB (minified)[11] 333.46 KB (uncompressed)[11] |
MIT | JavaScript / TypeScript |
| Webix | 11.0 November 2024 |
188 kB (gzipped) | GPL & Commercial[12] | JavaScript |
| ZK | 8.0.1 19 Jan 2016 |
Variable | LGPL & GPL & ZOL[13] | XML + Java (JavaScript optional) |
High-level framework comparison
Summarize
Perspective
JavaScript-based web application frameworks, such as React and Vue, provide extensive capabilities but come with associated trade-offs. These frameworks often extend or enhance features available through native web technologies, such as routing, component-based development, and state management. While native web standards, including Web Components, modern JavaScript APIs like Fetch and ES Modules, and browser capabilities like Shadow DOM, have advanced significantly, frameworks remain widely used for their ability to enhance developer productivity, offer structured patterns for large-scale applications, simplify handling edge cases, and provide tools for performance optimization. [14][15][16]
Frameworks can introduce abstraction layers that may contribute to performance overhead, larger bundle sizes, and increased complexity. Modern frameworks, such as React 18 and Vue 3, address these challenges with features like concurrent rendering, tree-shaking, and selective hydration. While these advancements improve rendering efficiency and resource management, their benefits depend on the specific application and implementation context. Lightweight frameworks, such as Svelte and Preact, take different architectural approaches, with Svelte eliminating the virtual DOM entirely in favor of compiling components to efficient JavaScript code, and Preact offering a minimal, compatible alternative to React. Framework choice depends on an application’s requirements, including the team’s expertise, performance goals, and development priorities. [14][15][16]
A newer category of web frameworks, including enhance.dev, Astro, and Fresh, leverages native web standards while minimizing abstractions and development tooling. [17][18][19] These solutions emphasize progressive enhancement, server-side rendering, and optimizing performance. Astro renders static HTML by default while hydrating only interactive parts. Fresh focuses on server-side rendering with zero runtime overhead. Enhance.dev prioritizes progressive enhancement patterns using Web Components. While these tools reduce reliance on client-side JavaScript by shifting logic to build-time or server-side execution, they still use JavaScript where necessary for interactivity. This approach makes them particularly suitable for performance-critical and content-focused applications. [14][15][16]
Features
| Angular | AngularJS | Apache Royale | Dojo | Ember.js | Enyo | Ext JS | Google Web Toolkit | jQuery | jQWidgets | MooTools | OpenUI5 | Prototype & script. aculo.us[9] | qooxdoo | React | SproutCore | Svelte | Vue | ZK | Webix | |
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| Feature detection[20] | Yes | Yes[21] | Yes | Yes[22] | No[23][24] | Yes[25] | Yes | Yes[26] | No[27] | Yes | Yes | No | Yes | |||||||
| DOM wrapped[28] | Yes | Yes | No | Yes | Yes | Yes | Yes | No[29] | No[30][31] | Yes | No | Yes | Yes | |||||||
| XMLHttpRequest data retrieval |
Yes | Yes | Yes[32] | Yes | Yes | Yes | Yes | Yes[33] | Yes[34] | Yes | Yes | Yes | Yes | Yes | ||||||
| WebSocket | Yes[32] | Yes | Yes | Yes | Yes | No | Yes[34] | Yes[35] | Yes | Yes | Via Plugin | Yes[36] | ||||||||
| Server push data retrieval | Yes[37] | Yes[38] | Yes[39] | Yes[37] | No | Via Plugin | Yes[40] | Yes | ||||||||||||
| Other data retrieval | Yes: XML, HTML, CSV, ATOM, AMF, JSON | Yes: XML, HTML, CSV, ATOM[41] | Yes: XML, SOAP, AMF, Ext.Direct | Yes: RPC, RequestFactory | Yes: XML, HTML | Yes: XML, JSON, CSV, TSV[33] | Yes: XML, HTML | Yes: XML, HTML, CS, JSON, JSArray, CSV | ||||||||||||
| Drag and drop | Yes | Yes[42] | Yes | With plugin[43] | With plugins[44] | Yes[45] | Yes[46] | Yes[47] | Yes | Yes | Yes | Yes | Yes[48] | |||||||
| Simple visual effects | Yes | Yes | Yes[49] | Yes | Yes | Yes | Yes | Yes | Yes[50] | Yes | Yes | Yes | Yes[51] | Yes[52] | Yes | Yes | ||||
| Animation / advanced visual effects |
Yes | Yes[53] | Yes[54] | Yes | Yes | Yes | Yes | Yes[55] | Yes | Yes | Yes[51] | Yes | Yes[56] | |||||||
| Back button support / history management |
Yes[57] | Yes | Yes[58] | Yes[59] | Yes | With plugins[60] | No | With plugin[61] | Yes | Yes | Yes | Yes | Yes | |||||||
| Input form widgets & validation | Yes | Yes | Yes[62] | Yes | Yes | Yes, Validation requires plugin[63] | With plugins[64] | Yes[65] | Yes | Yes | Yes | Yes | Yes | Yes | Yes[66][67] | |||||
| Angular | AngularJS | Apache Royale | Dojo | Ember.js | Enyo | ExtJS | Google Web Toolkit | jQuery | jQWidgets | MooTools | OpenUI5 | Prototype & script. aculo.us[9] | qooxdoo | React | SproutCore | Svelte | Vue | ZK | Webix | |
| Grid | Yes | Yes[68] | Yes | Yes | With plugins[69] | Yes[70] | With plugin[71] | Yes | Yes | Yes | Yes | Yes[72] | ||||||||
| Hierarchical Tree | Yes | Yes[73] | Yes[74] | Yes[75] | Yes | With plugins[76] | Yes[77] | With plugins[78] | Yes | Yes[79] | Yes | Yes | Yes[80] | |||||||
| Rich text editor | No | Yes | Yes[81] | Yes[82] | Yes | With plugins[83] | Yes[84] | Yes[85] | Yes | Via plugin | Yes | Yes[86] | ||||||||
| Autocompletion tools | No | Yes[87] | Yes | Yes | Yes[88] | Yes[89] | With plugin[90] | Yes | With plugins | Yes | Yes | |||||||||
| HTML generation tools | No | Yes[91] | Yes | Yes | Yes | Yes[84] | Yes[92] | Yes | Yes | Yes | Yes | Yes | ||||||||
| Widgets themeable / skinnable | Yes | Yes[93] | Yes | Yes[94] | Yes[95] | Yes[96] | Yes | Yes | Yes | Yes | Yes | Yes | ||||||||
| GUI resizable panels and modal dialogs | Yes | Yes | Yes | Yes[97] | Yes | With plugins | Yes[98] | Yes[99] | Yes | Yes | Yes[100] | Yes | ||||||||
| GUI page layout | Yes | Yes | Yes | With plugin[101] | Yes[102][103] | Yes[99] | Yes | Yes | Yes[100] | Yes[104] | ||||||||||
| Canvas support | Yes | Yes[105] | Yes | Yes | Yes | With plugin[106] | Yes[107] | Yes[108] | Yes | Yes | Yes[109] | Yes | ||||||||
| Mobile/tablet support (touch events) | Yes | Yes | Yes[110] | Yes | Yes | Yes | With plugin[111] | With plugin[112] | Yes[113] | With plugin[114] | Yes | Yes | Yes | Yes[115] | Yes[116] | |||||
| Accessibility / graceful degradation[117] |
Yes | Yes[118] | No | Yes | Yes[22] | Yes[119] | Yes | Yes[120] | Yes | No[121] | Degradation: No Accessibility: Yes |
Yes | Yes[122] | |||||||
| ARIA compliant | Yes[118] | Yes[22] | Yes[123] | Yes[120] | Yes | No | Yes | Yes[124] | Yes | Yes[125] | ||||||||||
| Developer tools, Visual design | Yes[126][127] | in progress[128] | Yes[129][130][131] | Yes | Yes[132][133] | Yes[134][135][136] | Yes[137][138] | Yes[139] | No | Yes | Yes[140][141] | |||||||||
| Offline storage[142] | Yes | No[143] | Yes | Yes[144] | Via Google Gears[145] | With plugin[146] | Yes[147] | Yes | Yes | Yes | Yes | |||||||||
| Cross-browser 2d Vector Graphics[148] | Yes[149] | Yes | With plugin[150] | Yes[107] | Yes[151] | No | Yes[109] | Yes (via Raphael)[152] | ||||||||||||
| Charting & Dashboard[153] | Yes | Yes[154] | Yes[155] | With plugin[156][157] | Yes[158][159] | No | Yes[160] | Yes[161] | ||||||||||||
| RTL Support in UI Components | Yes | Yes | Yes | Depends on the plugin used | Yes[120] | Yes | Yes | No | ||||||||||||
| Angular | AngularJS | Apache Royale | Dojo | Ember.js | Enyo | ExtJS | Google Web Toolkit | jQuery | jQWidgets | MooTools | OpenUI5 | Prototype & script. aculo.us[9] | qooxdoo | React | SproutCore | Svelte | Vue | ZK | Webix |
Browser support
| Framework | Internet Explorer | Mozilla Firefox | Safari | Opera | Chrome | Edge |
|---|---|---|---|---|---|---|
| Angular | Latest and extended support release | 2 most recent major versions | Latest and previous stable version | 2 most recent major versions | ||
| AngularJS (1.3) | 8+ (9+) | 4+ | 5+ | 11+ | 30+ | |
| Apache Royale | 9 (Edge --> 10) | 21 | 6 | 15 | 23 | |
| Dojo | 6+ | 3+[162] | 4[162] | 10.50+[162] | 3[162] | |
| Ember.js | 6+ | 3+ | 4+ | 10.6+ | 14+ | |
| Enyo | 8+[163] | >4[163] | >5[163] | >10[163] | ||
| Ext JS | 8+ | 45+ | 11+ | 43+ | 64+[164] | |
| Google Web Toolkit | 8+ | 1+ | 5+ | 9+ | 1+ | |
| jQuery (3.x) | 6+ (9+)[165] | 2+[165] | 3+[165] | 9+[165] | 1+[165] | |
| jQWidgets | 7+[166] | 2+[166] | 3+[166] | 9+[166] | 1+[166] | |
| MooTools | 6+ | 2+ | 3+ | 9+ | 1+ | |
| Prototype & script. aculo.us[9] | 6+ | 1.5+ | 2.0.4+ | 9.25+ | 1+ (starting with 1.6.1RC3) | |
| qooxdoo | 6+ | 2+ | 3+ | 9+ | 2+ | |
| React | ||||||
| SAP OpenUI5[167] | 11+ | Latest Stable and ESR | Last 2 | Latest Version | ||
| SproutCore | 6+ | 3+ | 4+ | 9+ | 1+ | |
| Svelte | 21+ | 6+ | 15+ | 23+ | 12+ | |
| Vue | 10+ | 21+ | 6+ | 15+ | 23+ | 12+ |
| ZK | 6+ | 2.0+ | 3+ | 9+ | 2+ | |
| Webix | 11+[168] | 93+[168] | 5+[168] | 95+[168] | 95+[168] | 95+[168] |
Notes
Wikiwand - on
Seamless Wikipedia browsing. On steroids.