Been feeling a little confident about your abilities as a developer? Try learning shaders, it'll knock you down a couple of pegs.

Spent nearly a week only on shaders and it's starting to click.

Here's some Perlin noise converted to ascii

I've never messed with sites that reveal text on scroll. I understand the case for images, but text less so.

Does anyone stand by them?

Thanks to @kizu 's article, I managed to remove the JavaScript for this "fill text" effect, and instead rely only on CSS

The Chrome flamegraphs show an improvement to performance as well

https://kizu.dev/fit-to-width/

When I built Learn WCs, I disabled animations on Firefox because the frame rate was so bad.

Turns out it was due to 2 CSS properties 👀

https://component-odyssey.com/articles/13-improving-performance-by-changing-two-lines-of-css

🏍️ The Two Lines of CSS That Tanked Performance (120fps to 40fps)

by Andrico X: @andricokaroulla @andrico

#webperf #performance #css #webdev

https://component-odyssey.com/articles/13-improving-performance-by-changing-two-lines-of-css

@pablolarah Thanks for sharing! I hope you found it interesting :)

I want to give a shoutout to @joshtumath and @backwardok . They offered some excellent advice for some of the issues I found :)

I did another round of testing on the Learn WCs site, including going more in-depth with a screen. I learnt a ton, like:

- when to hide decorative content
- when to create screen reader only content
- quirks between screen readers and browsers
- choosing HTML over ARIA to provide state information

I wrote up everything I learned here:

https://component-odyssey.com/articles/12-improving-the-screen-reader-experience-for-learn-wcs

I've published a blog post about my first week in the CSSWG! There's a lot to get your head around! https://www.joshtumath.uk/posts/2024-08-21-my-first-week-in-the-css-working-group/

@joshtumath Big congrats!

You'll be a huge asset to the working group for sure :)

I remember my first time joining an Open UI call, and using IRC for the first time. A little intimidating ha!

@stefan MD formatting is table stakes for me. Glad to see these changes in Google docs!

Here's the CodePen if anyone's interested in playing around with it: https://codepen.io/andrico1234/pen/jOjYbQM

I'm also not sure whether to make the right content a polite alert to alert screen reader users on change. Maybe landmarks to indicate that left content affects right content is less aggro.

aria-controls looks handy, but the left content would be inside shadow DOM

I have a little a11y question.

I have interactive elements on the left that changes content on the right

<button> works for keyboard + mouse but doesn't provide enough info for screen readers

Radio improves screen reader exp but the keyboard behaviour feels off

I wanted to field for thoughts

@heydon Now you've done it...

@heydon can't wait for you to reach the lesser-known `<abbr>`-adjacent element `<kadabrr>`

@cferdinandi I'm thinking of taking the same approach for the next time I redo my personal site.

I can almost guarantee that "sharp" will fail when I try to reinstall the dependencies for that old Gatsby project.

Today's politics in a nutshell

@stephband

ha! without spoiling anything, it looks like we've reached slightly different conclusions. Excited to see what you think

@stephband Thank you! I'm just finishing up the draft today. I'll throw it in a Google Drive and send you a DM, likely tomorrow :)