--- title: Improving Next.js app performance with BlurHash | daily.dev description: The time it takes a web app to load to the client depends on how long it takes to serve its application code, styles, and data. For example, you could use... canonical: https://daily.dev/posts/improving-next-js-app-performance-with-blurhash-jj7orfvcp twitter:card: summary_large_image twitter:site: @dailydotdev og:type: website og:site_name: daily.dev og:title: Improving Next.js app performance with BlurHash | daily.dev og:description: The time it takes a web app to load to the client depends on how long it takes to serve its application code, styles, and data. For example, you could use... og:url: https://daily.dev/posts/improving-next-js-app-performance-with-blurhash-jj7orfvcp og:image: https://api.daily.dev/og/posts/jJ7ORFvcP.png og:image:alt: Improving Next.js app performance with BlurHash og:image:width: 1200 og:image:height: 630 og:locale: en --- > ## Documentation Index > Fetch the complete documentation index at: https://daily.dev/llms.txt > Use this file to discover all available pages before exploring further. # Improving Next.js app performance with BlurHash **[LogRocket](https://daily.dev/sources/logrocket)** · 9 min read · 19 upvotes · 1 comments ## Summary The time it takes a web app to load to the client depends on how long it takes to serve its application code, styles, and data. For example, you could use server-side rendering to render the initial HTML of your web page on the server side before delivering it to the browser, use the Next.js. The amount that BlurHash impacts page speed can vary based on several factors. ## Full article daily.dev links to this article rather than hosting it. Read it at the original source: ## Community discussion Top comments from developers on daily.dev. **@mcnaveen** · 0 upvotes > I created [blurhash-from-url](https://www.npmjs.com/package/blurhash-from-url) that let's you to generate Blurhash string on the go. Also, I have created [Blurhash-CLI](https://www.npmjs.com/package/blurhash-cli) --- Tags: [#react](https://daily.dev/tags/react), [#performance](https://daily.dev/tags/performance), [#mobile](https://daily.dev/tags/mobile) [View this post on daily.dev](https://daily.dev/posts/improving-next-js-app-performance-with-blurhash-jj7orfvcp) ```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","@type":"TechArticle","headline":"Improving Next.js app performance with BlurHash","url":"https://daily.dev/posts/improving-next-js-app-performance-with-blurhash-jj7orfvcp","mainEntityOfPage":{"@type":"WebPage","@id":"https://daily.dev/posts/improving-next-js-app-performance-with-blurhash-jj7orfvcp"},"datePublished":"2022-09-27T14:34:10.853Z","dateModified":"2022-09-27T14:34:10.852Z","description":"The time it takes a web app to load to the client depends on how long it takes to serve its application code, styles, and data. For example, you could use...","image":"https://media.daily.dev/image/upload/f_auto,q_auto/v1/posts/d7ce7dc0ee23fc15df144c706511add5","thumbnailUrl":"https://media.daily.dev/image/upload/f_auto,q_auto/v1/posts/d7ce7dc0ee23fc15df144c706511add5","isAccessibleForFree":true,"articleSection":"LogRocket","inLanguage":"en","publisher":{"@type":"Organization","name":"daily.dev","url":"https://daily.dev","logo":{"@type":"ImageObject","url":"https://daily.dev/apple-touch-icon.png","width":180,"height":180}},"author":{"@type":"Organization","name":"LogRocket","logo":"https://media.daily.dev/image/upload/t_logo,f_auto/v1/logos/logrocket","url":"https://daily.dev/sources/logrocket"},"commentCount":1,"discussionUrl":"https://daily.dev/posts/improving-next-js-app-performance-with-blurhash-jj7orfvcp","interactionStatistic":[{"@type":"InteractionCounter","interactionType":{"@type":"LikeAction"},"userInteractionCount":19},{"@type":"InteractionCounter","interactionType":{"@type":"CommentAction"},"userInteractionCount":1}],"keywords":"react,performance,mobile","timeRequired":"PT9M"} {"@context":"https://schema.org","@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https://daily.dev"},{"@type":"ListItem","position":2,"name":"LogRocket","item":"https://daily.dev/sources/logrocket"},{"@type":"ListItem","position":3,"name":"Improving Next.js app performance with BlurHash"}]} {"@context":"https://schema.org","@type":"WebPage","@id":"https://daily.dev/posts/improving-next-js-app-performance-with-blurhash-jj7orfvcp","comment":[{"@type":"Comment","text":"I created blurhash-from-url that let’s you to generate Blurhash string on the go. Also, I have created Blurhash-CLI","datePublished":"2022-09-28T09:29:37.209Z","url":"https://daily.dev/posts/jJ7ORFvcP#c-P3LEitlXl","author":{"@type":"Person","name":"Naveen MC","url":"https://daily.dev/mcnaveen","image":"https://avatars.githubusercontent.com/u/8493007?v=4"}}]} ```