@nolan@toot.cafe
@nolan@toot.cafe avatar

nolan

@nolan@toot.cafe

toot.cafe admin, web dev at Salesforce, working on Lightning Web Components. Creator of https://pinafore.social. Former browser perf guy at Microsoft. #javascript #webcomponents

This profile is from a federated server and may be incomplete. Browse more on the original instance.

nolan, to random
@nolan@toot.cafe avatar

Good news for #webcomponents: Chromium fixed a perf bug for repeated stylesheets in shadow DOM: https://issues.chromium.org/issues/341327461

nolan,
@nolan@toot.cafe avatar

This is interesting to me because it makes it much more viable to build a polyfill for the "open-stylable" proposal: https://github.com/WICG/webcomponents/issues/909

Basically, if you want to have (say) a bootstrap.css which is referenced inside multiple shadow roots, previously you'd run into a gnarly perf cliff (I measured ~160x perf degradation just for 100 shadow roots). This is now fixed!

nolan,
@nolan@toot.cafe avatar

I'll also point out that this is why it's important to test in multiple browsers. A lot of people will run some perf experiment in Chrome, find it's slow, and conclude "OK, I guess the web is just slow at this."

But if you test Safari and Firefox and find they're fast, then congrats! You have a perf bug you can file on Chrome. I filed it and it got fixed 2 weeks later.

nolan, to random
@nolan@toot.cafe avatar

Learning Rust after using JavaScript almost exclusively for 10 years is a humbling experience. I feel stupid and unproductive in a way I haven't felt in years.

But it's good! Learning new things is good. Gaining empathy for newer programmers is good. I like the challenge.

nolan,
@nolan@toot.cafe avatar

It also helps that Rust has really good error messages. Although most of the time I read it as "You forgot to florp the flamp, did you mean to add &mut here?" And I'm just like, "Oh yeah man, I totally meant to do that," and then I copy-paste it in. (Although if Rust knows what I want… can't it just do it for me?)

nolan,
@nolan@toot.cafe avatar

I'm also probably disadvantaging myself by explicitly not using ChatGPT/Copilot for things like "how to join a Vector of strings with a comma." I'm using the actual dead-tree Rust book and StackOverflow like a caveman. But my hope is that it will stick in my brain better if I avoid the AI shortcut.

nolan,
@nolan@toot.cafe avatar

@matt I'm not at the point yet where I'm advanced enough to really make that decision. I'm just trying to get something to work; I can fine-tune it later.

(Again, this is giving me empathy for beginner JS devs who can't decide whether to use Promises vs async/await or whatever.)

nolan, to random
@nolan@toot.cafe avatar

"How Do Chrome Extensions Impact Website Performance In 2024?" by Matt Zeunert https://www.debugbear.com/blog/chrome-extensions-website-performance

Once again, one of the most reliable ways to speed up your browser is to uninstall extensions. (Except ad blockers.)

nolan, to random
@nolan@toot.cafe avatar

"Why Patching Globals Is Harmful" by Artem Zakharchenko https://kettanaito.com/blog/why-patching-globals-is-harmful

One of those classic lessons that apparently needs to be learned over and over again.

nolan, to random
@nolan@toot.cafe avatar

"Optimizing WebKit & Safari for Speedometer 3.0" https://webkit.org/blog/15249/optimizing-webkit-safari-for-speedometer-3-0/

Love all the little details here. Improving 60% by stacking a lot of small 1%-ish improvements is impressive.

nolan, to random
@nolan@toot.cafe avatar

"Node.js: The Documentary" https://youtu.be/LB8KwiiUGy0?si=fn3Qeaykl1KdUTR9

Great documentary. I still remember a lot of that early hacker spirit of Node.

nolan,
@nolan@toot.cafe avatar

I think you can get an idea of the cultural mindset of those early Node days by comparing the Browserify website to a more modern equivalent:

Nobody cared if your website was polished, or if it had crude cartoon characters or whatever – everyone just wanted to hack on cool stuff.

Semicolons were thrown away like neckties. Callbacks were cool. Nobody cared what crazy postinstall scripts you ran. It was a different time.

nolan, to random
@nolan@toot.cafe avatar

"My Shifting Open Source Priorities" by Gregory Szorc https://gregoryszorc.com/blog/2024/03/17/my-shifting-open-source-priorities

The details differ, but I identify a lot with this. Being the "random person in Nebraska" takes a lot of time and mental energy.

nolan, to random
@nolan@toot.cafe avatar

Vitest is pretty nice compared to Jest. I'm still not sold on testing a fake browser (jsdom, happy-dom), but at least it runs fast, has a nice UI, and no more CommonJS vs ESM zaniness.

nolan, to random
@nolan@toot.cafe avatar

New blog post: "Bugs I’ve filed on browsers" https://nolanlawson.com/2024/03/03/bugs-ive-filed-on-browsers/

Kind of a navel-gazey post, but I thought it'd be interesting to look back on the bugs I've filed on browsers over the past ~10 years.

nolan, to random
@nolan@toot.cafe avatar

Publishing npm packages as ESM-only and with no TypeScript is such a breath of fresh air. The published files are the same as the source files, just like we used to do with npm back in 2012

nikitonsky, to random
@nikitonsky@mastodon.online avatar

New post: JavaScript Bloat in 2024 https://tonsky.me/blog/js-bloat/

nolan,
@nolan@toot.cafe avatar

@nikitonsky Great post! Unfortunately though I think "disable cache" may be over-reporting. For react.dev for example, it looks like it is continually re-downloading the same resources as you scroll.

My workaround is usually to use a fresh private window rather than "disable cache," FWIW.

matt, to random

@nolan Any chance we can get a spam mute/block list set up on this instance, like this one: https://mastodon.de/@ErikUden/111954222362376457 Thanks for any time you can spare on this.

nolan,
@nolan@toot.cafe avatar

@matt Yeah I noticed that the spammer problem has been really bad recently. I've been getting like dozens of reports in a few days. I'll look into this.

nolan, to random
@nolan@toot.cafe avatar

"Write code for the web" by Manav Rathi https://mrmr.io/apple

This is from an iOS developer, but as an Android developer, I came to basically the same conclusion 10 years ago. The web isn't perfect, but it's a near-universal platform not owned by anybody.

nolan,
@nolan@toot.cafe avatar

Personally, I got tired of Google's constant breaking changes with every Android version, and all the hoops I had to jump through just to keep my apps listed. Whereas whatever garbage I put on the web 20 years ago still works today.

An investment in learning the web (even dumb stuff like document.all or document.write) still pays dividends decades later. Whereas all my old Android API knowledge is just gone, like tears in the rain.

nolan,
@nolan@toot.cafe avatar

The biggest danger to the web IMO is the emerging Google-Apple duopoloy, and the fact that whatever bugs existed in WebKit at the time of the Blink split will just be "how the web works." This is why projects like Servo, Ladybird, and Flow are so important – they prove you can still build a browser from scratch, just based on the spec. (And thank heavens for the spec writers who made this possible.)

nolan, to random
@nolan@toot.cafe avatar

New blog post: "Web component gotcha: constructor vs connectedCallback" https://nolanlawson.com/2024/01/13/web-component-gotcha-constructor-vs-connectedcallback/

This is just a quick post on a anti-pattern that I've seen countless times.

nolan,
@nolan@toot.cafe avatar

@hawkticehurst @DavidDarnes @andrew_chou This makes a pretty similar point to my article! I like the distinction you draw between global and local event listeners.

nolan,
@nolan@toot.cafe avatar

@hawkticehurst @DavidDarnes @andrew_chou Honestly it feels like we need a generic test suite that tests that a web component can be inserted/removed multiple times without blowing up, and that it doesn't leak (ala https://www.npmjs.com/package/fuite or https://www.npmjs.com/package/memlab or similar).

Realistically, I think a lot of devs are not going to grok the subtle difference between global vs local event listeners. Things like Resize/Intersection/Mutation Observer also vary across browsers w.r.t. memory cleanup.

nolan,
@nolan@toot.cafe avatar

@hawkticehurst @DavidDarnes @andrew_chou Actually scratch that last comment, looks like Jake Archibald went on a tear filing Resize/Intersection Observer leak bugs on browsers; seems they are all fixed now. https://bugs.webkit.org/show_bug.cgi?id=227194

So effectively *Observers should clean up memory when the element is removed. So same issue as event listeners.

  • All
  • Subscribed
  • Moderated
  • Favorites
  • •
  • JUstTest
  • InstantRegret
  • mdbf
  • ethstaker
  • magazineikmin
  • cubers
  • rosin
  • thenastyranch
  • Youngstown
  • osvaldo12
  • slotface
  • khanakhh
  • kavyap
  • DreamBathrooms
  • provamag3
  • Durango
  • everett
  • tacticalgear
  • modclub
  • anitta
  • cisconetworking
  • tester
  • ngwrru68w68
  • GTA5RPClips
  • normalnudes
  • megavids
  • Leos
  • lostlight
  • All magazines
    •