Thread by @manishrc, My #NextjsConf Watch Live List:🆇 When Not to Use #nextjs 🅴 #Jamstack [...]

Manish Chiniwalar

manishrc

My #NextjsConf Watch Live List:

🆇 When Not to Use #nextjs
🅴 #Jamstack for E-Commerce at Scale
🅽 Why Images Hurt App'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't know about https://www.reactstorefront.io/

https://www.moovweb.com/cdn-as-javascript

🅽 Why Images Hurt Your App'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 (

)

--
Me: Host images on a different [sub]domain to get around max concurrent limit per host. https://bit.ly/2TuttV0

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

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 - functions, forms
http://xstate.js.org
http://statecharts.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

@jondahl on why

for the play button.

Reminds me of

You can follow @manishrc.

Tip: mention @twtextapp on a Twitter thread with the keyword “unroll” to get a link to it.

Latest Threads Unrolled: