My #NextjsConf Watch Live List:

🆇 When Not to Use #nextjs
🅴 #Jamstack for E-Commerce at Scale
🅽 Why Images Hurt App& #39;s Performance…
🆃 Next.js: A Framework For Frameworks
🅽 Future of Performance & Data…
🆇 How to Learn #React…
🆇 Adventures in Next.js
🅴 How Video Works…
🅴 #Jamstack for E-Commerce at Scale

Didn& #39;t know about https://www.reactstorefront.io/ ">https://www.reactstorefront.io/">...
https://www.moovweb.com/cdn-as-javascript">https://www.moovweb.com/cdn-as-ja...
🅽 Why Images Hurt Your App& #39;s Performance and How The New Image Component Can Help - @atcastle

Problem: Oversized Images
Solution: `Image` component that will generate srcset w/ image optimisations

Works w/ 3rd party hosting + auto-formatting
Problem: Too many Images
Solution: Default to Lazy Loading

Escape hatch using `priority` or setting `loading="eager"`
Problem: Loading CSS/JS are prioritised over images
Solution: Preload header for images by setting `priority` on the Image component (https://abs.twimg.com/emoji/v2/... draggable="false" alt="⚠️" title="Warnsignal" aria-label="Emoji: Warnsignal">)

--
Me: Host images on a different [sub]domain to get around max concurrent limit per host. https://bit.ly/2TuttV0 ">https://bit.ly/2TuttV0&q...
Blocking: The Web Performance Villain

You may not realize it, but your pages may be slowing down due to something that usually flies under the radar. Learn what you can do today about blocking.

https://bit.ly/2TuttV0
Problem: Content shifts as the images load
Solution: `Image` component will enforce height & width (ratio, no px required).

Opt-out using `unsized` attribute.
Read More: https://nextjs.org/docs/basic-features/image-optimization">https://nextjs.org/docs/basi...
Basic Features: Image Optimization | Next.js

Next.js supports built-in image optimization, as well as third party loaders for Imgix, Cloudinary, and more! Learn more here.

https://nextjs.org/docs/basic-features/image-optimization
▔▔
🅽 Future of Performance and Data in the Modern Web

@MongoDB will do Search, provide mobile SDK for low-latency changes with sync to cloud and Multi-cloud clusters.
@ianand:

There are two major things that makes a site slow:

You are either network-bound or CPU-bound.

And #JavaScript can hurt you on both of those.
"Biggest source of innovation is going to be *people caring* [...] up and down the organisation." — @ianand
▔
🆇 How to Learn #React / #NextJS or anything — @arunoda
▔▔▔
🆇 (Choosing our own) Adventures in Next.js — @cassidoo

http://netlify.com"> http://netlify.com  - functions, forms
http://xstate.js.org"> http://xstate.js.org 
http://statecharts.io"> http://statecharts.io 
http://hasura.io"> http://hasura.io 
🅴 How Video Works: A Dive into the Biggest Thing on the Internet, and Why You Should Care — @jondahl

34.88% of waking hours is spent on Video https://abs.twimg.com/emoji/v2/... draggable="false" alt="🧐" title="Gesicht mit Monokel" aria-label="Emoji: Gesicht mit Monokel">
@jondahl on why https://abs.twimg.com/emoji/v2/... draggable="false" alt="▶️" title="Nach rechts zeigendes Dreieck" aria-label="Emoji: Nach rechts zeigendes Dreieck"> for the play button.

Reminds me of https://youtube.com/watch?v=Tf17rFDjMZw">https://youtube.com/watch...
You can follow @manishrc.
Tip: mention @twtextapp on a Twitter thread with the keyword “unroll” to get a link to it.

Latest Threads Unrolled:
There are a lot of misconceptions about the Turkish diaspora in Germany. Since i just finished writing an essay about this topic I thought it's time to give other people
Read more
Las mejores calculadoras online en 2020A thread http://totumat.com/2020/11/26/las-mejores-calculadoras-online-en-2020/ Cuando se estudian asignaturas que requieren de cálculos complicados, nada mejor que contar con una buena calculadora.
Read more
Mitigating #ClimateChange is as much about taking up new techs as about leaving others behindMost studies focus on #coal's global downfall but another #energy tech decline is loomingRead my new
Read more