Comparison of JavaScript-based web frameworks

From Wikipedia, the free encyclopedia
Jump to navigation Jump to search

Template:Short description Script error: No such module "Hatnote". Script error: No such module "Unsubst". Script error: No such module "Unsubst".

This is a comparison of web frameworks for front-end web development that are reliant on JavaScript code for their behavior.

General information

Framework Version
compared 		Size License Source language
Template:Rh|Angular 14.0.4
29 June 2022 		563 kB (minified & compressed) MIT TypeScript
Template:Rh|AngularJS 1.5.0
5 Feb 2016 		144 kB (minified & compressed) MIT JavaScript
Template:Rh|Apache Royale 0.9.4
5 Nov 2018 		19 kB (zipped) Apache ActionScript 3, MXML, CSS
Template:Rh|Backbone.js 1.2.1
June 2015 		7.3 kB (Packed and gzipped) MIT JavaScript
Template:Rh|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
Template:Rh|Ember.js 1.7.0
19 Aug 2014 		95 kB (minified & gzipped),
340 kB (minified),
1.5 MB (uncompressed) 		MIT JavaScript
Template:Rh|Enyo 2.0.1
30 Aug 2012 		<25 kB (core gzipped) Apache 2[2] JavaScript
Template:Rh|Ext JS 7.3
15 Sept, 2020 		84–502 kB GPL & Commercial[3] JavaScript
Template:Rh|Google Web Toolkit 2.10.0
June 2022 		Variable Apache Java
Template:Rh|jQuery (library) 3.6.0
3 Mar 2021 		70.7KB (slim, minified),
87.4KB (minified),[4]
282 KiB (uncompressed)[4] 		MIT JavaScript
Template:Rh|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
Template:Rh|Knockout 3.5.0
22 February 2019 		66.4 KB minified / 309 KB (development mode) MIT JavaScript
Template:Rh|MooTools 1.6.0
14 Jan 2016 		Variable;
7.3–65 KiB (YUI Compressor),[6]


Variable;
7.3–65 KiB (YUI Compressor),[7]
101 KiB (uncompressed)[8]

MIT JavaScript
Template:Rh|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
Template:Rh|qooxdoo 5.0.1
15 Sep 2015 		Variable, starting at 6 kB (gzipped) LGPL & EPL JavaScript
Template:Rh|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
Template:Rh|SAP OpenUI5 1.102.1
15 Jun 2022 		Variable, starting at 213 kB (gzipped) Apache 2[10] JavaScript
Template:Rh|SproutCore 1.11.2
2 May 2016 		250–700 kB (gzipped). MIT JavaScript
Template:Rh|Svelte 3.12.1
14 Oct 2019 		Variable MIT JavaScript
Template:Rh|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
Template:Rh|Webix 11.0
November 2024 		188 kB (gzipped) GPL & Commercial[12] JavaScript
Template:Rh|ZK 8.0.1
19 Jan 2016 		Variable LGPL & GPL & ZOL[13] XML + Java (JavaScript optional)

High-level framework comparison

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
Template:Rh| Feature detection[20] Yes Yes[21] Yes Yes[22] No[23][24] Yes[25] Yes Yes[26] No[27] Yes Yes No Yes
Template:Rh| DOM wrapped[28] Yes Yes No Yes Yes Yes Yes No[29] No[30][31] Yes No Yes Yes
Template:Rh| XMLHttpRequest
data retrieval 		Yes Yes Yes[32] Yes Yes Yes Yes Yes[33] Yes[34] Yes Yes Yes Yes Yes
Template:Rh| WebSocket Yes[32] Yes Yes Yes Yes No Yes[34] Yes[35] Yes Yes Via Plugin Yes[36]
Template:Rh| Server push data retrieval Yes[37] Yes[38] Yes[39] Yes[37] No Via Plugin Yes[40] Yes
Template:Rh| 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
Template:Rh| 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]
Template:Rh| Simple visual effects Yes Yes Yes[49] Yes Yes Yes Yes Yes Yes[50] Yes Yes Yes Yes[51] Yes[52] Yes Yes
Template:Rh| Animation /
advanced visual effects 		Yes Yes[53] Yes[54] Yes Yes Yes Yes Yes[55] Yes Yes Yes[51] Yes Yes[56]
Template:Rh| 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
Template:Rh| 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
Template:Rh| Grid Yes Yes[68] Yes Yes With plugins[69] Yes[70] With plugin[71] Yes Yes Yes Yes Yes[72]
Template:Rh| 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]
Template:Rh| Rich text editor No Yes Yes[81] Yes[82] Yes With plugins[83] Yes[84] Yes[85] Yes Via plugin Yes Yes[86]
Template:Rh| Autocompletion tools No Yes[87] Yes Yes Yes[88] Yes[89] With plugin[90] Yes With plugins Yes Yes
Template:Rh| HTML generation tools No Yes[91] Yes Yes Yes Yes[84] Yes[92] Yes Yes Yes Yes Yes
Template:Rh| Widgets themeable / skinnable Yes Yes[93] Yes Yes[94] Yes[95] Yes[96] Yes Yes Yes Yes Yes Yes
Template:Rh| GUI resizable panels and modal dialogs Yes Yes Yes Yes[97] Yes With plugins Yes[98] Yes[99] Yes Yes Yes[100] Yes
Template:Rh| GUI page layout Yes Yes Yes With plugin[101] Yes[102][103] Yes[99] Yes Yes Yes[100] Yes[104]
Template:Rh| Canvas support Yes Yes[105] Yes Yes Yes With plugin[106] Yes[107] Yes[108] Yes Yes Yes[109] Yes
Template:Rh| 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]
Template:Rh| 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]
Template:Rh| ARIA compliant Yes[118] Yes[22] Yes[123] Yes[120] Yes No Yes Yes[124] Yes Yes[125]
Template:Rh| 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]
Template:Rh| Offline storage[142] Yes No[143] Yes Yes[144] Via Google Gears[145] With plugin[146] Yes[147] Yes Yes Yes Yes
Template:Rh| Cross-browser 2d Vector Graphics[148] Yes[149] Yes With plugin[150] Yes[107] Yes[151] No Yes[109] Yes (via Raphael)[152]
Template:Rh| Charting & Dashboard[153] Yes Yes[154] Yes[155] With plugin[156][157] Yes[158][159] No Yes[160] Yes[161]
Template:Rh| 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
Template:Rh|Angular Latest and extended support release 2 most recent major versions Latest and previous stable version 2 most recent major versions
Template:Rh|AngularJS (1.3) 8+ (9+) 4+ 5+ 11+ 30+
Template:Rh|Apache Royale 9 (Edge --> 10) 21 6 15 23
Template:Rh|Dojo 6+ 3+[162] 4[162] 10.50+[162] 3[162]
Template:Rh|Ember.js 6+ 3+ 4+ 10.6+ 14+
Template:Rh|Enyo 8+[163] >4[163] >5[163] >10[163]
Template:Rh|Ext JS 8+ 45+ 11+ 43+ 64+[164]
Template:Rh|Google Web Toolkit 8+ 1+ 5+ 9+ 1+
Template:Rh|jQuery (3.x) 6+ (9+)[165] 2+[165] 3+[165] 9+[165] 1+[165]
Template:Rh|jQWidgets 7+[166] 2+[166] 3+[166] 9+[166] 1+[166]
Template:Rh|MooTools 6+ 2+ 3+ 9+ 1+
Template:Rh|Prototype & script. aculo.us[9] 6+ 1.5+ 2.0.4+ 9.25+ 1+ (starting with 1.6.1RC3)
Template:Rh|qooxdoo 6+ 2+ 3+ 9+ 2+
Template:Rh|React
Template:Rh|SAP OpenUI5[167] 11+ Latest Stable and ESR Last 2 Latest Version
Template:Rh|SproutCore 6+ 3+ 4+ 9+ 1+
Template:Rh|Svelte 21+ 6+ 15+ 23+ 12+
Template:Rh|Vue 10+ 21+ 6+ 15+ 23+ 12+
Template:Rh|ZK 6+ 2.0+ 3+ 9+ 2+
Template:Rh|Webix 11+[168] 93+[168] 5+[168] 95+[168] 95+[168] 95+[168]

Notes

<templatestyles src="Reflist/styles.css" />

  1. ↑ Dojo Base Script error: No such module "webarchive".
  2. ↑ Script error: No such module "citation/CS1".
  3. ↑ Script error: No such module "citation/CS1".
  4. ↑ a b Script error: No such module "citation/CS1".
  5. ↑ Script error: No such module "citation/CS1".
  6. ↑ Script error: No such module "citation/CS1".
  7. ↑ Script error: No such module "citation/CS1".
  8. ↑ Script error: No such module "citation/CS1".
  9. ↑ a b c d e script.aculo.us is an add-on to Prototype.
  10. ↑ Script error: No such module "citation/CS1".
  11. ↑ a b Script error: No such module "citation/CS1".
  12. ↑ Script error: No such module "citation/CS1".
  13. ↑ Script error: No such module "citation/CS1".
  14. ↑ a b c Script error: No such module "citation/CS1".
  15. ↑ a b c Script error: No such module "citation/CS1".
  16. ↑ a b c Script error: No such module "citation/CS1".
  17. ↑ Script error: No such module "citation/CS1".
  18. ↑ Script error: No such module "citation/CS1".
  19. ↑ Script error: No such module "citation/CS1".
  20. ↑ Feature detection is preferred by many to browser sniffing to support future browsers: Browser Detecting (and what to do Instead), Feature Detection: State of the Art Browser Scripting, Browser Feature Detection Script error: No such module "webarchive".
  21. ↑ Script error: No such module "citation/CS1".
  22. ↑ a b c Script error: No such module "citation/CS1".
  23. ↑ Script error: No such module "citation/CS1".
  24. ↑ Script error: No such module "citation/CS1".
  25. ↑ Script error: No such module "citation/CS1".
  26. ↑ Script error: No such module "citation/CS1".
  27. ↑ Feature detection all the way Script error: No such module "webarchive".
  28. ↑ Script error: No such module "citation/CS1".
  29. ↑ Script error: No such module "citation/CS1".
  30. ↑ Script error: No such module "citation/CS1".
  31. ↑ Script error: No such module "citation/CS1".
  32. ↑ a b AJAX and Dojo Script error: No such module "webarchive".
  33. ↑ a b Script error: No such module "citation/CS1".
  34. ↑ a b Script error: No such module "citation/CS1".
  35. ↑ Script error: No such module "citation/CS1".
  36. ↑ Script error: No such module "citation/CS1".
  37. ↑ a b Script error: No such module "citation/CS1".
  38. ↑ Script error: No such module "citation/CS1".
  39. ↑ Script error: No such module "citation/CS1".
  40. ↑ Script error: No such module "citation/CS1".
  41. ↑ Script error: No such module "citation/CS1".
  42. ↑ Script error: No such module "citation/CS1".
  43. ↑ Script error: No such module "citation/CS1".
  44. ↑ Script error: No such module "citation/CS1".
  45. ↑ Script error: No such module "citation/CS1".
  46. ↑ Script error: No such module "citation/CS1".
  47. ↑ Script error: No such module "citation/CS1".
  48. ↑ Script error: No such module "citation/CS1".
  49. ↑ Script error: No such module "citation/CS1".
  50. ↑ Script error: No such module "citation/CS1".
  51. ↑ a b Script error: No such module "citation/CS1".
  52. ↑ Script error: No such module "citation/CS1".
  53. ↑ Script error: No such module "citation/CS1".
  54. ↑ Script error: No such module "citation/CS1".
  55. ↑ Script error: No such module "citation/CS1".
  56. ↑ Script error: No such module "citation/CS1".
  57. ↑ Script error: No such module "citation/CS1".
  58. ↑ Script error: No such module "citation/CS1".
  59. ↑ Script error: No such module "citation/CS1".
  60. ↑ Script error: No such module "citation/CS1".
  61. ↑ Script error: No such module "citation/CS1".
  62. ↑ Script error: No such module "citation/CS1".
  63. ↑ Script error: No such module "citation/CS1".
  64. ↑ Script error: No such module "citation/CS1".
  65. ↑ Script error: No such module "citation/CS1".
  66. ↑ Script error: No such module "citation/CS1".
  67. ↑ Script error: No such module "citation/CS1".
  68. ↑ Script error: No such module "citation/CS1".
  69. ↑ Script error: No such module "citation/CS1".
  70. ↑ Script error: No such module "citation/CS1".
  71. ↑ Script error: No such module "citation/CS1". or Script error: No such module "citation/CS1". or Script error: No such module "citation/CS1".
  72. ↑ Script error: No such module "citation/CS1".
  73. ↑ Script error: No such module "citation/CS1".
  74. ↑ Script error: No such module "citation/CS1".
  75. ↑ Script error: No such module "citation/CS1".
  76. ↑ Script error: No such module "citation/CS1"., Script error: No such module "citation/CS1".
  77. ↑ Script error: No such module "citation/CS1".
  78. ↑ Script error: No such module "citation/CS1".
  79. ↑ Script error: No such module "citation/CS1".
  80. ↑ Script error: No such module "citation/CS1".
  81. ↑ Script error: No such module "citation/CS1".
  82. ↑ Script error: No such module "citation/CS1".
  83. ↑ markitup, jwysiwyg, htmlbox Script error: No such module "webarchive"., WYMeditor Script error: No such module "webarchive".
  84. ↑ a b Script error: No such module "citation/CS1".
  85. ↑ Script error: No such module "citation/CS1".
  86. ↑ Script error: No such module "citation/CS1".
  87. ↑ Script error: No such module "citation/CS1".
  88. ↑ Script error: No such module "citation/CS1".
  89. ↑ Script error: No such module "citation/CS1".
  90. ↑ Script error: No such module "citation/CS1".
  91. ↑ As of Dojo 1.3, the NodeList.addContent() api can be used to create content for example: dojo.query(".note").addContent("h4 NOTE: h4", "before");
  92. ↑ MooTools Elements Script error: No such module "webarchive".
  93. ↑ Script error: No such module "citation/CS1".
  94. ↑ Script error: No such module "citation/CS1".
  95. ↑ Script error: No such module "citation/CS1".
  96. ↑ Script error: No such module "citation/CS1".
  97. ↑ Script error: No such module "citation/CS1".
  98. ↑ Script error: No such module "citation/CS1".
  99. ↑ a b Using MochaUI Library or JxLib Script error: No such module "webarchive".
  100. ↑ a b Script error: No such module "citation/CS1".
  101. ↑ Script error: No such module "citation/CS1".
  102. ↑ Script error: No such module "citation/CS1".
  103. ↑ Script error: No such module "citation/CS1".
  104. ↑ Script error: No such module "citation/CS1".
  105. ↑ dojo.gfx Script error: No such module "webarchive".
  106. ↑ Script error: No such module "citation/CS1".
  107. ↑ a b Script error: No such module "citation/CS1".
  108. ↑ Script error: No such module "citation/CS1".
  109. ↑ a b Script error: No such module "citation/CS1".
  110. ↑ Script error: No such module "citation/CS1".
  111. ↑ Script error: No such module "citation/CS1".
  112. ↑ Script error: No such module "citation/CS1".
  113. ↑ Script error: No such module "citation/CS1".
  114. ↑ Script error: No such module "citation/CS1".
  115. ↑ Script error: No such module "citation/CS1".
  116. ↑ [1] Webix mobile/tablet support
  117. ↑ All JavaScript frameworks can be written in an accessible way with graceful degradation, frameworks seen here which imply out-of-the-box accessibility have made a special effort to document best practices for their particular framework.
  118. ↑ a b Script error: No such module "citation/CS1".
  119. ↑ Script error: No such module "citation/CS1".
  120. ↑ a b c Script error: No such module "citation/CS1".
  121. ↑ Qooxdoo's "Extreme JavaScript" paradigm Script error: No such module "webarchive".
  122. ↑ Script error: No such module "citation/CS1".
  123. ↑ Script error: No such module "citation/CS1".
  124. ↑ Script error: No such module "citation/CS1".
  125. ↑ Script error: No such module "citation/CS1".
  126. ↑ Wavemaker
  127. ↑ Aptana Studio
  128. ↑ Script error: No such module "citation/CS1".
  129. ↑ Script error: No such module "citation/CS1".
  130. ↑ Script error: No such module "citation/CS1".
  131. ↑ Script error: No such module "citation/CS1".
  132. ↑ Script error: No such module "citation/CS1".
  133. ↑ Script error: No such module "citation/CS1".
  134. ↑ Script error: No such module "citation/CS1".
  135. ↑ Script error: No such module "citation/CS1".
  136. ↑ Script error: No such module "citation/CS1".
  137. ↑ Script error: No such module "citation/CS1".
  138. ↑ Script error: No such module "citation/CS1".
  139. ↑ Custom build, JS Linker, API generation, Unit test framework, etc. Script error: No such module "webarchive".
  140. ↑ Script error: No such module "citation/CS1".
  141. ↑ Script error: No such module "citation/CS1".
  142. ↑ JavaScript frameworks currently only have the ability to support offline storage by taking advantage of pre-installed browser extensions such as Google Gears. If a user does not have one of these supported extensions installed in their browser already then offline support will be unavailable to the framework. JavaScript framework developers interested in implementing Gears may want to start with the Gears Getting Started Guide.
  143. ↑ o.DojoToolkit.Org/offline Script error: No such module "webarchive". says "Dojo Offline is no longer supported after Dojo 1.3"
  144. ↑ Script error: No such module "citation/CS1".
  145. ↑ Script error: No such module "citation/CS1".
  146. ↑ Script error: No such module "citation/CS1".
  147. ↑ Script error: No such module "citation/CS1".
  148. ↑ Some JavaScript libraries provide 2d graphics primitives that can be used for cross-browser vector graphics. These libraries rely on underlying technologies in the browser or plugins such as Canvas, SVG, VML, Flash, and Silverlight to do the actual rendering, but help isolate application and widget code from the rendering engine API differences
  149. ↑ Script error: No such module "citation/CS1".
  150. ↑ jQuery SVG plugin
  151. ↑ Script error: No such module "citation/CS1".
  152. ↑ Script error: No such module "citation/CS1".
  153. ↑ Some JavaScript libraries include widgets for Charts, Gauges, and other data visualizations.
  154. ↑ Script error: No such module "citation/CS1".
  155. ↑ Chart API
  156. ↑ Script error: No such module "citation/CS1".
  157. ↑ jQuery Visualize Plugin Script error: No such module "webarchive".
  158. ↑ Script error: No such module "citation/CS1".
  159. ↑ Script error: No such module "citation/CS1".
  160. ↑ Script error: No such module "citation/CS1".
  161. ↑ Script error: No such module "citation/CS1".
  162. ↑ a b c d Script error: No such module "citation/CS1".
  163. ↑ a b c d Script error: No such module "citation/CS1".
  164. ↑ Script error: No such module "citation/CS1".
  165. ↑ a b c d e Script error: No such module "citation/CS1".
  166. ↑ a b c d e Script error: No such module "citation/CS1".
  167. ↑ Script error: No such module "citation/CS1".
  168. ↑ a b c d e f Script error: No such module "citation/CS1".

Script error: No such module "Check for unknown parameters".

Script error: No such module "Navbox". Script error: No such module "Navbox". Template:JavaScript

Retrieved from "http://debianws.lexgopc.com/wiki143/index.php?title=Comparison_of_JavaScript-based_web_frameworks&oldid=6599970"