├── .whitesource └── README.md /.whitesource: -------------------------------------------------------------------------------- 1 | { 2 | "generalSettings": { 3 | "shouldScanRepo": true 4 | }, 5 | "checkRunSettings": { 6 | "vulnerableCheckRunConclusionLevel": "failure" 7 | } 8 | } -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # awesome-react-performance 2 | List of links that talks about how to optimise performance 3 | 4 | 1. React/Redux Performance Tuning Tips - https://medium.com/%40arikmaor/react-redux-performance-tuning-tips-cef1a6c50759 5 | 2. React performance optimization tool - https://github.com/reactopt/reactopt 6 | 3. Detecting Memory Leaks Using Chrome Developer Tools - https://www.youtube.com/watch?v=j4Uvk5zxrhM 7 | 4. JavaScript Memory & Processing Profiling In Chrome - https://www.youtube.com/watch?v=KKwmdTByxLk 8 | 5. Use Immutable - https://facebook.github.io/react/docs/advanced-performance.html, https://www.youtube.com/watch?v=wA98Coal4jk 9 | 6. Create Pure components - https://facebook.github.io/react/docs/reusable-components.html 10 | 7. Use purerendermixin - https://facebook.github.io/react/docs/pure-render-mixin.html 11 | 8. Avoid pure render performance anti pattern - https://medium.com/@esamatti/react-js-pure-render-performance-anti-pattern-fb88c101332f#.l1my3iwkj 12 | 9. Use chrome dev toolbar for load screenshot and profiling - https://www.youtube.com/watch?v=pt4TjbSQz-g 13 | 10. Use lib like sitespeed and PSI - https://github.com/sitespeedio/sitespeed.io, https://github.com/addyosmani/psi 14 | 11. Understand React Performance tips - https://facebook.github.io/react/docs/perf.html 15 | 12. Use Performance.now - https://developer.mozilla.org/en-US/docs/Web/API/Performance/now 16 | 13. Understand critical rendering path - https://developers.google.com/web/fundamentals/performance/critical-rendering-path/analyzing-crp?hl=en 17 | 14. http://techbeacon.com/web-performance-testing-top-12-free-open-source-tools-consider 18 | 15. Console when potentially unnecessary re-renders occur https://github.com/garbles/why-did-you-update 19 | 16. High Performance React: 3 New Tools to Speed Up Your Apps https://medium.freecodecamp.org/make-react-fast-again-tools-and-techniques-for-speeding-up-your-react-app-7ad39d3c1b82 20 | 17. React Anti Pattern https://github.com/nfour/js-structures/blob/master/guides/react-anti-patterns.md 21 | 18. Debugging React Performance with React 16 and Chrome dev tools https://building.calibreapp.com/debugging-react-performance-with-react-16-and-chrome-devtools-c90698a522ad 22 | 19. ReactCasre#9 - Immutability in Java Script https://www.youtube.com/watch?v=4LzcQyZ9JOU 23 | 20. React.js Conf 2015 - Making your app fast with high-performance components https://www.youtube.com/watch?v=KYzlpRvWZ6c 24 | 21. Impress Your Friends With Code Splitting in React https://hackernoon.com/impress-your-friends-with-code-splitting-in-react-9f9a3ca2ae6e 25 | 22. React performance tips https://medium.com/@joomiguelcunha/react-performance-tips-5fa199a450b2 26 | 23. Performance optimizations for React applications: Round 2 https://medium.com/@alexandereardon/performance-optimisations-for-react-applications-round-2-2042e5c9af97 27 | 24. Server Rendering, Code Splitting, and Lazy Loading with React Router v4 https://medium.com/airbnb-engineering/server-rendering-code-splitting-and-lazy-loading-with-react-router-v4-bfe596a6af70 28 | 25. React & Performance https://slides.com/balramsingh/react-performace/fullscreen#/ --------------------------------------------------------------------------------