# How to Make Your React Apps 15x Faster

DevFeed: [How to Make Your React Apps 15x Faster](<https://devfeed.tech/articles/how-to-make-your-react-apps-15x-faster-21862.md>)

Original publisher: [Read original article](<https://reactjsnews.com/how-to-make-your-react-apps-10x-faster>)

Author: Zach Silveira

Published: 2016-04-07T17:00:00Z

Content type: tutorial

Language: en

Sources: [ReactJS News](<https://devfeed.tech/sources/reactjs-news.md>)

Topics: [React](<https://devfeed.tech/topics/react.md>), [JavaScript](<https://devfeed.tech/topics/javascript.md>), [Single-page application (SPA)](<https://devfeed.tech/topics/spa.md>), [Chrome](<https://devfeed.tech/topics/chrome.md>), [modern web development](<https://devfeed.tech/topics/modern-web-development.md>)

Tags: [babel](<https://devfeed.tech/tags/babel.md>), [chrome](<https://devfeed.tech/tags/chrome.md>), [how-to](<https://devfeed.tech/tags/how-to.md>), [javascript](<https://devfeed.tech/tags/javascript.md>), [optimization](<https://devfeed.tech/tags/optimization.md>), [performance](<https://devfeed.tech/tags/performance.md>), [react](<https://devfeed.tech/tags/react.md>), [webpack](<https://devfeed.tech/tags/webpack.md>)

## AI overview

A tutorial on measuring and improving the runtime performance of React applications. It describes establishing a baseline with Chrome DevTools and reports reducing HelloSign's render time from more than 3,000 milliseconds to less than 200 milliseconds through several fixes.

## Source excerpt

Without any modifications, React is really fast as-is. There are, however, a few things that you can do to improve performance. While working at HelloSign, I discovered some quick fixes that made our apps incredibly snappy. With these simple changes, I was able to reduce render time from over 3000 milliseconds to less than 200 milliseconds. Without any modifications, React is really fast as-is. There are, however, a few things that you can do to improve performance. While working at HelloSign, I discovered some quick fixes that made our apps incredibly snappy. With these simple changes, I was able to reduce render time from over 3000 milliseconds to less than 200 milliseconds. Editor's Note: Check out our upcoming React University Workshops. Our next workshop, React 2016, will be held on April 23 at Microsoft Reactor in San Francisco and will offer a deep dive into creating modern Single-Page Applications (SPA) using React, Redux, React Router, Immutable.js, and Webpack. Also, if you're interested in learning the basics about what it takes to be a Data Visualization Engineer, check out React and D3. Introduction HelloSign is a cloud-based electronic signature tool founded in 2010. As you can imagine, HelloSign is a very JavaScript-heavy codebase. A lot of client-side behavior is necessary to create a rich signing experience. Lately, we've moved much of our codebase toward React. In fact, in many places we've broken up our codebase into several single-page applications written in React. Although the HelloSign team was happy with React's performance before I initially joined the project, I quickly found some low-hanging fruit that could improve runtime speed. Here are the steps you should take to see similar improvements in your own applications. Create a Baseline Performance Measurement Before you begin, you should take a baseline measurement. Optimizations are meaningless if you can't verify the results of your modifications. Thankfully, Chrome has excellent develop