Alex Castle

Software Engineer at Google & lapsed technology writer

[Alex Castle @atcastle]

Recently I've been working on adding automatic image placeholders to Angular, and with version 17.2, it's finally available! Really excited to see what people think. https://t.co/n8J4k9RJTt

[Gerald Monaco @devknoll]

Another delightful feature available in Angular v17 is: phases for afterRender and afterNextRender!

Now Angular can optimally schedule callbacks for an application and all of its libraries, minimizing layout thrashing!

[Alex Castle @atcastle]

Really excited about one of the features I worked on for this release--automated preconnects! Now, when you use NgOptimizedImage, Angular looks for image domains in your code and automatically adds preconnect links, which can improve your LCP score by a lot.

[Angular @angular]

Angular v17.

The framework you love, with a fresh new look, and:
🦥 deferrable views
⚡️ up to 90% faster, intuitive built-in control flow
🏎️ up to 87% faster build times with hybrid rendering
🏗️ Vite + esbuild builds
+ more!

https://t.co/mBtYROh2u7

[Alex Castle @atcastle]

@benLune @karaforthewin @mgechev @angular Could you say a little more about what you mean by element responsive? Appreciate all the feedback

[Alex Castle @atcastle]

@charliegreenman @karaforthewin @brandontroberts @angular Thanks for this feedback--I'm making a note to add more tests around SVG use cases.

[Alex Castle @atcastle]

@tempoririac @angular For NgOptimizedImage specifically, there's a pretty detailed getting started guide at https://t.co/uJRTLeQDPw

[Alex Castle @atcastle]

@ninan_phillip @brandontroberts @angular Loaders mainly let you request images at different sizes, which generally requires using a CDN that has that capability. NgOptimizedImage still works without it, but you miss out on some of the optimizations.

[Alex Castle @atcastle]

@traore_lionel @angular Cool, when you do we'd love any feedback about the experience of using it with Ionic

[Alex Castle @atcastle]

@BernardNgandu @angular You should check it out! It's for adding automatic performance optimizations to image: https://t.co/Zb1ynTsjjU

[Alex Castle @atcastle]

@advaithsurya @karaforthewin @angular For more advanced sizing, you can put the image inside a <div> or other element, then use fill mode to make it totally fill that element. More info at https://t.co/Zb1ynTrLum

[Alex Castle @atcastle]

@KhizerDev @angular Yes, SVGs should work, although some of the optimizations like automated srcsets are less relevant for SVGs.

[Alex Castle @atcastle]

@mikelhamer @angular If you have images in your app, you should give it a look! https://t.co/M8nLxIODI1

[Alex Castle @atcastle]

@brianpooe @angular That's good feedback--thanks!

[Alex Castle @atcastle]

@benLune @angular To get behavior different than the default full-viewport width, you can use the `sizes` attribute (https://t.co/NysBGLffdg), which is fully supported by NgOptimizedImage. For example, `sizes="20vw"` would be correct for 5 columns

[Angular @angular]

If you haven't had a chance to try out NgOptimizedImage, we'd love to hear why:

[Alex Castle @atcastle]

Super excited that we got to backport the new NgOptimizedImage directive to Angular 13! Now these performance optimizations are available to a bigger chunk of the Angular ecosystem:

[Angular @angular]

Are you running Angular v13? Still want to take advantage of the NgOptimizedImage directive?

Chrome Aurora has partnered with Angular to backport the image directive! This gives you access to:

- srcset generation
- fill mode
- loader config options

https://t.co/qAEVm7IC3M

[Houssein Djirdeh @hdjirdeh]

I wrote an RFC for a new @nextjs package that would make it easier to load popular third-party libraries 🎉

Share your feedback!

https://t.co/W9np5Z1Mue

[Vercel @vercel]

Next.js Layouts RFC

◆ Nested routes / layouts
◆ Designed for Server Components
◆ Fetch in layouts while avoiding waterfalls
◆ React 18 features – startTransition, Suspense
◆ Client and server routing
◆ 100% incrementally adoptable

https://t.co/jvaVOmyB8A

[Alex Castle @atcastle]

Excited to be part of Next.js Conf today! My talk's going to be playing on stage N at 10:50 PST

https://t.co/TKEpCKwHiy

[Addy Osmani @addyosmani]

Tip: @ChromeDevTools has a Shadow Editor built in!