--- title: Best Performance posts of 2022 | daily.dev description: The most upvoted Performance posts of 2022, curated by the daily.dev community. canonical: https://daily.dev/tags/performance/best-of/2022 twitter:card: summary_large_image twitter:site: @dailydotdev og:url: https://daily.dev/tags/performance/best-of/2022 og:type: website og:site_name: daily.dev og:title: Best Performance posts of 2022 | daily.dev og:description: The most upvoted Performance posts of 2022, curated by the daily.dev community. og:image: https://media.daily.dev/image/upload/s--VAY5ToZt--/f_auto/v1724209435/public/daily.dev%20-%20open%20graph --- # Best of Performance — 2022 1. 1 [](/posts/making-a-fast-website-is-super-easy-vk259awq6 "Making a fast website is SUPER EASY") Article Community Picks · 4y Making a fast website is SUPER EASY For a website whose goal is to convert customers by selling goods or services, the website should be attractive to look at. Images take up a huge part of the website's total size. As of August 2022, images made up on average 45% on desktop and 44% on mobile of a page’s total weight. Optimizing the images can therefore result in big and easy wins. 344 25 2. 2 [](/posts/why-react-re-renders-iftwro8ck "Why React Re-Renders") Article Josh W Comeau · 4y Why React Re-Renders This tutorial is written to help beginner-intermediate React developers get more comfortable with React. It's the only “trigger” in React for a component to re-render. In React, every state change in React forces an application-wide render, but this isn't true. In this case, it sees that our paragraph has a text node that changed from 0 to 1. 305 18 3. 3 [](/posts/react-js-best-practices-waoh0crtk "React JS Best Practices") Article Medium · 4y React JS Best Practices The React style guide is a set of recommendations for writing clean, maintainable code with React. Hooks are a new feature in React that allow you to use state and other React features without writing a class. The React memo higher-order component is a way to optimize the performance of your functional components. 187 14 4. 4 [](/posts/is-react-going-anywhere--kk7qnx1wi "Is React going anywhere?") Article Community Picks · 4y Is React going anywhere? React will be 10 years old on the 29th of May 2023 (finally recruiters are able to ask for 10 years of experience, without being a laughing stock) React is getting old, and when applications start to get old, you start finding issues, loads of them. 183 23 5. 5 [](/posts/best-practices-for-scaling-your-node-js-rest-apis-4nu2ywmmo "Best Practices for Scaling Your Node.js REST APIs") Article freeCodeCamp · 4y Best Practices for Scaling Your Node.js REST APIs Use throttling at the first junction point between your application and the News Feed Service. Use the ELK stack for setting up a good logging and alerting pipeline. If a request goes through multiple services during the lifecycle, you can pass along a unique ID in the logs to capture a particular request across all the services. 180 20 6. 6 [](/posts/the-programming-language-s-of-the-future-gs7aiuzqt "The Programming Language(s) of the Future") Article Dev Genius · 4y The Programming Language(s) of the Future C, C++, and Rust are not that easy, they force you to think about object lifetimes, dynamic allocations, etc. But even just in 3 categories, there are lots of differences and blurry decisions. If we consider the ease of use, and power of the implemented structures, the results will get more blurry. Until now, what have we learned? We compared the languages. 178 11 7. 7 [](/posts/make-your-react-apps-fast-again-o6yn0qp7o "Make your React apps fast again") Article Community Picks · 4y Make your React apps fast again Profiler can help you improve performance of a React application. We will go over ways to improve the performance of an app, including some pre-optimization techniques. We can use the Profiler in the React DevTools to measure performance of our apps. To use the profiler, you must Some are asynchronous, such as background HTTP calls, while others occur by user or You. 170 6 8. 8 [](/posts/is-flutter-better-than-react-native--aic74lmxo "Is Flutter better than React Native?") Article Community Picks · 4y Is Flutter better than React Native? Flutter and React Native are natural competitors as two of the most used multi-platform mobile app frameworks. The answer lies not in the technical aspects of React Native and Flutter at all. Hiring developers is famously difficult right now, but the pool of developers to draw from is far larger than Flutter's. 164 14 9. 9 [](/posts/react-re-renders-guide-everything-all-at-once-ujm34lmdu "React re-renders guide: everything, all at once") Article Community Picks · 4y React re-renders guide: everything, all at once Re -render happens when React needs to update the app with new data. Preventing re-renders with composition is an anti-pattern that can be the biggest performance killer. On every re-render React will re-mount this component (i.e. destroy it and re-create it from scratch), which is going to be much slower than a normal re-rendered. This pattern can be beneficial when a heavy component manages state. 157 18 10. 10 [](/posts/working-with-dates-and-times-with-day-js-h80g0u-sr "Working with Dates and Times with Day.js") Article asayer · 4y Working with Dates and Times with Day.js Day.js is a straightforward JavaScript tool for manipulating, displaying, and validating dates and times. It can be used in client-side and server-side rendering and works flawlessly in both scenarios. When we run Day. JS in the browser, the.format() method returns a string in ISO format. This is fairly similar to the vanilla JavaScript’s to ISOString() date constructor method. 139 8 11. 11 [](/posts/vite-3-0-vs-create-react-app-kyqilrbzn "Vite 3.0 vs. Create React App") Article LogRocket · 4y Vite 3.0 vs. Create React App Vite is built on top of esbuild, a JavaScript bundler written in Go, which bundles dependencies 10-100 times faster than JavaScript-based bundlers. Vite leverages the browser’s native ESM to parse and compile your code as the browser requests it. The browser only needs to pre-bundle your dependencies. 135 7 12. 12 [](/posts/introduction-to-micro-frontends-ob18ceq5k "Introduction to Micro-frontends") Article Community Picks · 4y Introduction to Micro-frontends Micro-frontends is the beginning of the micro frontends journey. The idea behind Micro Frontends is to think about a website or web app as a composition of features which are owned by independent teams. Each team should be able to choose and upgrade their stack without having to coordinate with other teams. 133 5 13. 13 [](/posts/two-lines-of-css-that-boosts-7x-rendering-performance--poc1ar1ee "Two lines of CSS that boosts 7x rendering performance!") Article DEV · 4y Two lines of CSS that boosts 7x rendering performance! Website's nowadays need to be optimal and performant, users on the web have very short attention span. Most common use cases for this is when you have huge list/grid of data that needs to render at the mount of the application. With progressing web development it will soon be supported in all browsers too. 131 7 14. 14 [](/posts/the-baseline-for-web-development-in-2022-2l4cghrwh "The baseline for web development in 2022") Article Pointer · 5y The baseline for web development in 2022 Alan Dávalos is a front-end engineer at LINE. He analyzed the changes in the web between 2021 and 2022\. The biggest change that happened in 2021 was the retirement of Internet Explorer (IE) The new baseline for web development in 2022 is: low-spec Android devices in terms of performance, Safari from two years before in Terms of Web Standards, and 4G. 126 8 15. 15 [](/posts/what-is-bun-js-and-why-is-the-javascript-community-excited-about-it--m7kptmcko "What Is Bun.js and Why Is the JavaScript Community Excited About It?") Article Community Picks · 4y What Is Bun.js and Why Is the JavaScript Community Excited About It? Bun is the third of its kind after Node.js and Deno.js, created by Jarred Sumner using the Zig programming language. Bun advances to provide new levels of speed and enhanced complexity. 118 10 16. 16 [](/posts/meet-bun-a-javascript-runtime-for-the-whole-dev-lifecycle-zwtjuvixx "Meet Bun: A JavaScript Runtime for the Whole Dev Lifecycle") Article The New Stack · 4y Meet Bun: A JavaScript Runtime for the Whole Dev Lifecycle Bun is a drop-in replacement for running JavaScript and Typescript applications. It was designed to be an all-in-one tool for bundling, transpiling, and running code at lightning speed. It processes about three times more HTTP requests per second than Node.js when rendering React server-side. 116 3 17. 17 [](/posts/html-is-all-you-need-to-make-a-website-y8fkchbia "HTML is all you need to make a website") Article Community Picks · 4y HTML is all you need to make a website At the dawn of Web 1.0, there was only HTML. At the heart of every website is pure, unadulterated HTML. The first website ever is still online, and yes — it's just HTML. 111 30 18. 18 [](/posts/astro-1-0-opwkfsmtg "Astro 1.0") Article Hacker News · 4y Astro 1.0 Astro v1.0 is a web framework for building fast, content-focused websites. Over the last 16 months, Astro has grown from an empty repo to over 13,000 stars on GitHub and 30,000 early users around the world. Astro has already been Addy Osmani, Software Engineer, Google Chrome Astro’s fast performance is even more noticeable to end users. 108 7 19. 19 [](/posts/why-use-nextjs--wkvj6vhdh "Why use NextJS?") Article Community Picks · 4y Why use NextJS? Next.js allows you to develop fast and user-friendly web applications and static websites using React.js. It is a ReactJS framework for building server-rendered web applications. It includes a number of features out of the box, such as Automatic code splitting, filesystem-based routing, hot code reloading and universal rendering. 106 17 20. 20 [](/posts/islands-architecture-07aorfu73 "Islands Architecture") Article Community Picks · 4y Islands Architecture Islands architecture borrows concepts from different sources and aims to combine them optimally. Marko is an open-source framework developed and maintained by eBay to improve server rendering performance. Astro: Astro is a static site builder that can generate lightweight static HTML pages from UI components built in other frameworks such as React, Preact, Svelte, 104 5 21. 21 [](/posts/intro-to-html-first-frontend-frameworks-oi6a2hux9 "Intro to HTML-first Frontend Frameworks") Article SitePen · 4y Intro to HTML-first Frontend Frameworks Qwik API allows Qwik to bootstrap with a very small amount of framework code. Qwik is used for builder.io which is a complex, interactive, stateful web application. Marko 6 is in the works and it will be interesting to see what they achieve. 101 7 22. 22 [](/posts/big-o-cheat-sheet-time-complexity-chart-ifsyqadbs "Big O Cheat Sheet – Time Complexity Chart") Article freeCodeCamp · 4y Big O Cheat Sheet – Time Complexity Chart Big O, also known as Big O notation, represents an algorithm's worst-case complexity. Big O defines the runtime required to execute an algorithm by identifying how the performance of your algorithm will change as the input size grows. In plain terms, the algorithm will run input + 2 times, where input can be any number. 100 4 23. 23 [](/posts/javascript-debounce-vs-throttle-awlyjquyd "JavaScript Debounce vs. Throttle") Article Syncfusion · 4y JavaScript Debounce vs. Throttle JavaScript Debounce and throttling are two simple, yet powerful techniques we can use in JavaScript applications to improve performance. In this article, I will introduce debounce and throttle in JavaScript, and discuss why we need to use them. The concept of debounce is pretty straightforward. 93 3 24. 24 [](/posts/facebook-lexical-lexical-is-an-extensible-text-editor-framework-that-provides-excellent-reliability-y-4fjkmne "facebook/lexical: Lexical is an extensible text editor framework that provides excellent reliability, accessibility and performance.") Article Pointer · 5y facebook/lexical: Lexical is an extensible text editor framework that provides excellent reliability, accessibility and performance. Lexical is an extensible JavaScript web text-editor framework with an emphasis on reliability, accessibility and performance. Lexical aims to provide a best-in-class developer experience, so you can easily prototype and build features with confidence. Combined with a highly extensible architecture, Lexical allows developers to create unique text editing experiences that scale in size and functionality. 90 7 25. 25 [](/posts/visual-studio-2022-17-4-is-now-available--a6eoannsp "Visual Studio 2022 17.4 is now available!") Article Visual Studio Blog · 4y Visual Studio 2022 17.4 is now available! This is our first GA release to support Arm64.NET 7, enterprise support for setup including rollback, and much more detailed below. We welcome your feedback in the threads to this post or through Developer Community. You can use Microsoft Endpoint Manager (formerly known as Intune) to manage all of this. 85 2 [See all Performance archives](/tags/performance/best-of) ```json {"@context":"https://schema.org","@graph":[{"@type":"Organization","@id":"https://daily.dev/#organization","name":"daily.dev","url":"https://daily.dev","logo":{"@type":"ImageObject","url":"https://daily.dev/apple-touch-icon.png","width":180,"height":180},"sameAs":["https://twitter.com/dailydotdev","https://github.com/dailydotdev","https://www.linkedin.com/company/daily-dev-ltd"]},{"@type":"WebSite","@id":"https://daily.dev/#website","url":"https://daily.dev","name":"daily.dev","publisher":{"@id":"https://daily.dev/#organization"},"potentialAction":{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https://daily.dev/search?q={search_term_string}"},"query-input":"required name=search_term_string"}}]} {"@context":"https://schema.org","@graph":[{"@type":"CollectionPage","@id":"https://daily.dev/tags/performance/best-of/2022#page","url":"https://daily.dev/tags/performance/best-of/2022","name":"Best Performance Posts of 2022","description":"The most upvoted Performance posts of 2022, curated by the daily.dev community.","isPartOf":{"@type":"WebSite","url":"https://daily.dev"}},{"@type":"ItemList","@id":"https://daily.dev/tags/performance/best-of/2022#items","numberOfItems":25,"itemListElement":[{"@type":"ListItem","position":1,"url":"https://daily.dev/posts/making-a-fast-website-is-super-easy-vk259awq6","name":"Making a fast website is SUPER EASY"},{"@type":"ListItem","position":2,"url":"https://daily.dev/posts/why-react-re-renders-iftwro8ck","name":"Why React Re-Renders"},{"@type":"ListItem","position":3,"url":"https://daily.dev/posts/react-js-best-practices-waoh0crtk","name":"React JS Best Practices"},{"@type":"ListItem","position":4,"url":"https://daily.dev/posts/is-react-going-anywhere--kk7qnx1wi","name":"Is React going anywhere?"},{"@type":"ListItem","position":5,"url":"https://daily.dev/posts/best-practices-for-scaling-your-node-js-rest-apis-4nu2ywmmo","name":"Best Practices for Scaling Your Node.js REST APIs"},{"@type":"ListItem","position":6,"url":"https://daily.dev/posts/the-programming-language-s-of-the-future-gs7aiuzqt","name":"The Programming Language(s) of the Future"},{"@type":"ListItem","position":7,"url":"https://daily.dev/posts/make-your-react-apps-fast-again-o6yn0qp7o","name":"Make your React apps fast again"},{"@type":"ListItem","position":8,"url":"https://daily.dev/posts/is-flutter-better-than-react-native--aic74lmxo","name":"Is Flutter better than React Native?"},{"@type":"ListItem","position":9,"url":"https://daily.dev/posts/react-re-renders-guide-everything-all-at-once-ujm34lmdu","name":"React re-renders guide: everything, all at once"},{"@type":"ListItem","position":10,"url":"https://daily.dev/posts/working-with-dates-and-times-with-day-js-h80g0u-sr","name":"Working with Dates and Times with Day.js"},{"@type":"ListItem","position":11,"url":"https://daily.dev/posts/vite-3-0-vs-create-react-app-kyqilrbzn","name":"Vite 3.0 vs. Create React App"},{"@type":"ListItem","position":12,"url":"https://daily.dev/posts/introduction-to-micro-frontends-ob18ceq5k","name":"Introduction to Micro-frontends"},{"@type":"ListItem","position":13,"url":"https://daily.dev/posts/two-lines-of-css-that-boosts-7x-rendering-performance--poc1ar1ee","name":"Two lines of CSS that boosts 7x rendering performance!"},{"@type":"ListItem","position":14,"url":"https://daily.dev/posts/the-baseline-for-web-development-in-2022-2l4cghrwh","name":"The baseline for web development in 2022"},{"@type":"ListItem","position":15,"url":"https://daily.dev/posts/what-is-bun-js-and-why-is-the-javascript-community-excited-about-it--m7kptmcko","name":"What Is Bun.js and Why Is the JavaScript Community Excited About It?"},{"@type":"ListItem","position":16,"url":"https://daily.dev/posts/meet-bun-a-javascript-runtime-for-the-whole-dev-lifecycle-zwtjuvixx","name":"Meet Bun: A JavaScript Runtime for the Whole Dev Lifecycle"},{"@type":"ListItem","position":17,"url":"https://daily.dev/posts/html-is-all-you-need-to-make-a-website-y8fkchbia","name":"HTML is all you need to make a website"},{"@type":"ListItem","position":18,"url":"https://daily.dev/posts/astro-1-0-opwkfsmtg","name":"Astro 1.0"},{"@type":"ListItem","position":19,"url":"https://daily.dev/posts/why-use-nextjs--wkvj6vhdh","name":"Why use NextJS?"},{"@type":"ListItem","position":20,"url":"https://daily.dev/posts/islands-architecture-07aorfu73","name":"Islands Architecture"},{"@type":"ListItem","position":21,"url":"https://daily.dev/posts/intro-to-html-first-frontend-frameworks-oi6a2hux9","name":"Intro to HTML-first Frontend Frameworks"},{"@type":"ListItem","position":22,"url":"https://daily.dev/posts/big-o-cheat-sheet-time-complexity-chart-ifsyqadbs","name":"Big O Cheat Sheet – Time Complexity Chart"},{"@type":"ListItem","position":23,"url":"https://daily.dev/posts/javascript-debounce-vs-throttle-awlyjquyd","name":"JavaScript Debounce vs. Throttle"},{"@type":"ListItem","position":24,"url":"https://daily.dev/posts/facebook-lexical-lexical-is-an-extensible-text-editor-framework-that-provides-excellent-reliability-y-4fjkmne","name":"facebook/lexical: Lexical is an extensible text editor framework that provides excellent reliability, accessibility and performance."},{"@type":"ListItem","position":25,"url":"https://daily.dev/posts/visual-studio-2022-17-4-is-now-available--a6eoannsp","name":"Visual Studio 2022 17.4 is now available!"}]},{"@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https://daily.dev"},{"@type":"ListItem","position":2,"name":"Tags","item":"https://daily.dev/tags"},{"@type":"ListItem","position":3,"name":"Performance","item":"https://daily.dev/tags/performance"},{"@type":"ListItem","position":4,"name":"Best of","item":"https://daily.dev/tags/performance/best-of"},{"@type":"ListItem","position":5,"name":"2022"}]}]} ```