Performance Test Results

Comparable browser performance measurements for Mosmox UI and popular React, Vue, and Angular UI frameworks.

This page contains reproducible local measurements for Mosmox UI and nine popular React, Vue, and Angular UI solutions. The results compare this specific workload, machine, browser, dependency lockfile, and viewport—not every possible use case. A separate button stress test is included below; it is intentionally not merged into the production-like ranking.

Test workload

Every implementation renders the same production page with 500 interactive cards, a filter input, a toggle, and four equivalent test actions. Playwright opens each page in headless Chrome at 1440×900, waits for the application-ready marker, and performs five runs per implementation.

Measured values:

Cold load — time from navigation until the page is loaded and ready.
App ready — time until the first application-ready marker after render.
Local update — time to update one local control without changing the card collection.
Bulk update — time after changing the content revision of all 500 visible cards.
Filter update — time to filter the collection to the matching cards.
Toggle update — time to toggle the controlled state.
DOM nodes — number of DOM nodes after the initial render.
Transfer — bytes transferred for page resources.
JS heap — approximate JavaScript heap usage reported by Chrome.

Browser render speed ranking

Because the primary goal of this benchmark is browser rendering speed, the main ranking is ordered by App ready: the time until the first complete application-ready marker after the initial render. Cold load is shown as a secondary loading signal. Lower values are better.

Rank	Implementation	App ready	Cold load	Bulk update	DOM nodes	Transfer	JS heap
1	Mosmox UI	46 ms	88 ms	97 ms	2,536	409.1 KB	4.9 MB
2	React · MUI	79 ms	129 ms	117 ms	2,537	349.0 KB	12.8 MB
3	Angular · Material	92 ms	125 ms	93 ms	4,070	465.3 KB	8.1 MB
4	Vue · Element Plus	101 ms	114 ms	117 ms	3,038	511.0 KB	14.0 MB
5	Angular · NG-ZORRO	112 ms	138 ms	95 ms	2,538	996.1 KB	14.2 MB
6	Vue · Quasar	115 ms	139 ms	119 ms	3,545	479.1 KB	15.2 MB
7	React · Ant Design	117 ms	167 ms	128 ms	3,052	553.5 KB	25.8 MB
8	Angular · PrimeNG	124 ms	150 ms	92 ms	2,038	343.6 KB	16.0 MB
9	React · Chakra UI	149 ms	159 ms	125 ms	2,536	500.0 KB	18.7 MB
10	Vue · Vuetify	214 ms	237 ms	177 ms	8,065	508.8 KB	44.9 MB

After removing the redundant simple-button wrapper, Mosmox UI remains first for initial browser render at 46 ms and now matches Chakra UI's DOM count at 2,536 nodes. The five-run median still shows other libraries leading some specialized interaction paths, so those results remain separate rather than being folded into a synthetic overall score.

Visual comparison

The charts below make the most important timing differences easier to scan. Each chart uses one scale for all implementations; a shorter bar means a faster result. The primary render chart and the interaction charts are separate tests.

Browser render speed ranking

App ready

Initial application-ready marker · lower is better

Mosmox UI46 ms

React · MUI79 ms

Angular · Material92 ms

Vue · Element Plus101 ms

Angular · NG-ZORRO112 ms

Vue · Quasar115 ms

React · Ant Design117 ms

Angular · PrimeNG124 ms

React · Chakra UI149 ms

Vue · Vuetify214 ms

Cold load

Navigation to loaded page · lower is better

Mosmox UI88 ms

Vue · Element Plus114 ms

Angular · Material125 ms

React · MUI129 ms

Angular · NG-ZORRO138 ms

Vue · Quasar139 ms

Angular · PrimeNG150 ms

React · Chakra UI159 ms

React · Ant Design167 ms

Vue · Vuetify237 ms

Bulk update

Update all 500 cards · lower is better

Angular · PrimeNG92 ms

Angular · Material93 ms

Angular · NG-ZORRO95 ms

Mosmox UI97 ms

React · MUI117 ms

Vue · Element Plus117 ms

Vue · Quasar119 ms

React · Chakra UI125 ms

React · Ant Design128 ms

Vue · Vuetify177 ms

DOM nodes

Initial rendered document size · lower is better

Angular · PrimeNG2,038 nodes

Mosmox UI2,536 nodes

React · Chakra UI2,536 nodes

React · MUI2,537 nodes

Angular · NG-ZORRO2,538 nodes

Vue · Element Plus3,038 nodes

React · Ant Design3,052 nodes

Vue · Quasar3,545 nodes

Angular · Material4,070 nodes

Vue · Vuetify8,065 nodes

Transfer

Transferred page resources · lower is better

Angular · PrimeNG343.6 KB

React · MUI349.0 KB

Mosmox UI409.1 KB

Angular · Material465.3 KB

Vue · Quasar479.1 KB

React · Chakra UI500.0 KB

Vue · Vuetify508.8 KB

Vue · Element Plus511.0 KB

React · Ant Design553.5 KB

Angular · NG-ZORRO996.1 KB

JS heap

Measured JavaScript heap · lower is better

Mosmox UI4.9 MB

Angular · Material8.1 MB

React · MUI12.8 MB

Vue · Element Plus14.0 MB

Angular · NG-ZORRO14.2 MB

Vue · Quasar15.2 MB

Angular · PrimeNG16.0 MB

React · Chakra UI18.7 MB

React · Ant Design25.8 MB

Vue · Vuetify44.9 MB

Button stress test

2,000 direct Button components · five-run medians

Button app ready

Initial render of 2,000 buttons · lower is better

Mosmox UI51 ms

Angular · Material93 ms

React · MUI122 ms

Vue · Element Plus130 ms

React · Chakra UI149 ms

Angular · NG-ZORRO165 ms

Vue · Quasar169 ms

React · Ant Design180 ms

Angular · PrimeNG195 ms

Vue · Vuetify221 ms

Update 2,000 buttons

Mass label update · lower is better

Angular · PrimeNG174 ms

Mosmox UI196 ms

Angular · NG-ZORRO227 ms

Vue · Element Plus264 ms

React · Chakra UI267 ms

React · MUI282 ms

React · Ant Design288 ms

Vue · Quasar320 ms

Angular · Material351 ms

Vue · Vuetify487 ms

Button DOM nodes

Initial rendered document size · lower is better

Mosmox UI2,020 nodes

React · MUI2,021 nodes

React · Chakra UI2,023 nodes

Angular · PrimeNG2,023 nodes

Vue · Element Plus4,020 nodes

Angular · NG-ZORRO4,021 nodes

React · Ant Design4,027 nodes

Vue · Quasar6,020 nodes

Vue · Vuetify8,022 nodes

Angular · Material10,028 nodes

Button JS heap

Measured JavaScript heap · lower is better

Mosmox UI5.7 MB

Angular · Material10.4 MB

Angular · PrimeNG18.5 MB

React · Chakra UI23.7 MB

Vue · Element Plus26.0 MB

Vue · Quasar26.9 MB

React · MUI28.1 MB

Angular · NG-ZORRO36.1 MB

Vue · Vuetify50.5 MB

React · Ant Design51.8 MB

React frameworks

Rank	Implementation	Cold load	App ready	Bulk update	DOM nodes	Transfer	JS heap
1	React · MUI	129 ms	79 ms	117 ms	2,537	349.0 KB	12.8 MB
2	React · Ant Design	167 ms	117 ms	128 ms	3,052	553.5 KB	25.8 MB
3	React · Chakra UI	159 ms	149 ms	125 ms	2,536	500.0 KB	18.7 MB

Vue frameworks

Rank	Implementation	Cold load	App ready	Bulk update	DOM nodes	Transfer	JS heap
1	Vue · Element Plus	114 ms	101 ms	117 ms	3,038	511.0 KB	14.0 MB
2	Vue · Quasar	139 ms	115 ms	119 ms	3,545	479.1 KB	15.2 MB
3	Vue · Vuetify	237 ms	214 ms	177 ms	8,065	508.8 KB	44.9 MB

Angular frameworks

Rank	Implementation	Cold load	App ready	Bulk update	DOM nodes	Transfer	JS heap
1	Angular · Material	125 ms	92 ms	93 ms	4,070	465.3 KB	8.1 MB
2	Angular · NG-ZORRO	138 ms	112 ms	95 ms	2,538	996.1 KB	14.2 MB
3	Angular · PrimeNG	150 ms	124 ms	92 ms	2,038	343.6 KB	16.0 MB

Performance Test Results

Test workloadCopy Anchor Link

Browser render speed rankingCopy Anchor Link

Visual comparisonCopy Anchor Link

Browser render speed ranking

App ready

Cold load

Bulk update

DOM nodes

Transfer

JS heap

Button stress test

Button app ready

Update 2,000 buttons

Button DOM nodes

Button JS heap

React frameworksCopy Anchor Link

Vue frameworksCopy Anchor Link

Angular frameworksCopy Anchor Link

On this page

Test workload

Browser render speed ranking

Visual comparison

React frameworks

Vue frameworks

Angular frameworks