Now that we have built the same application using a couple of different TypeScript compatible libraries, we can compare apples with apples in terms of performance. Each framework is loading an HTML page, which will load the required libraries, along with the bootstrap.css files, and any dependent packages. Each sample application is doing exactly the same things, which include the following:
- Loading an array of objects to use as the default collection
- Rendering a single view for each of the objects in the collection
- Combining each single view into a view for the entire collection
- Rendering a title element, and a selected item element to show which item is currently selected
- Attaching the generated HTML to the DOM
If we run each version of this application in the same browser, and open up our handy developer tools, we can start to compare how long each...