Email or username:

Password:

Forgot your password?
18 posts total
Zach Leatherman :11ty:

1. use this web component, it has zero dependencies, weighs 4KB, shipped in 2018—still works great

2. OR, you can use this react component—it has many dependencies, requires a transpiler, weighs 200KB+, uses outdated react best practices from 3 months ago

you gotta choose #2, right? otherwise they’re gonna make fun of you

Lea Rosema

@zachleat Unfortunately, managers sometimes tend to give you the salary increase for the overengineered 200kb thing, not for the smol 4kb one 🙈.

Zach Leatherman :11ty:

love to get annoyingly productive right before a long vacation weekend but not productive enough to finish the thing so it can live rent free in my head for even more time

Zach Leatherman :11ty:

“Bluesky is insulated from billionaire influence because everything is open source!”

oh you sweet summer child

Zach Leatherman :11ty:

there is only one hard problem in computer science: abstracting the entirety of CSS into HTML classes

Rian

@zachleat We’ll start by creating a system of CSS Custom Properties that allow us to write machine code, and eventually object code and assembly. This foundation weights in at…

Zach Leatherman :11ty:

For years there has been a stinky cloud of web performance misinformation and propaganda coming from folks in the React community.

So much so that apparently a 57 score on Lighthouse is “fast” (even with 1160ms of TBT and a 5.4s LCP).

(There is *some* nuance here, of course—but we haven’t graduated to those discussions yet!)

If you too want to pretend that your slow web site is fast, use this handy guide: zachleat.com/web/lighthouse-de

Paul Hebert

@zachleat thanks for writing this Zach!

On a project a while ago we ran into a lot of headaches trying to compare Lighthouse scores over time to track performance changes.

Even the difference between running mobile lighthouse tests on a new M1 Macbook and an older Intel-powered Macbook was huge. We ended up having to change our strategy and rely more on tools like webpagetest.org.

I wish there was more info out there about how device variability impacts these scores!

Zach Leatherman :11ty:

Absolutely LOVE to see the new `fediverse:creator` tags showing up on shared URLs, providing automated attribution controlled by the source!

blog.joinmastodon.org/2024/07/

Incredible feature.

Rian

@zachleat Shout out for spelling-out `fediverse` instead of some cryptic abbreviation

Jack Jackson

@zachleat looking forward to when I can get it working! I've copied/adapted tags from pages that it worked for (and updated my allowed domains), but no luck. It's not clear from the article whether it's your home server or the server that you view the post on that needs to be on the latest version - but that's my best guess.

Zach Leatherman :11ty:

JSX: yes
TypeScript: sure
CommonJS & ESM: no problem
Decorators: yeehaw
Web Components: how dare you, this is too much tooling overhead and complexity

Tegan

@zachleat every one of those besides web components (and i guess esm) can go out of fashion and never be thought about again without breaking the web.

Web components are calcified how they are forever since they are built in to the platform you can only do additive changes which is why complexity is an issue with them 🤷‍♀️

Zach Leatherman :11ty:

independent of my well-being, rest assured that I am doing my best to ensure that your email never finds me

Zach Leatherman :11ty:

#1 superfan of the CSS Anchor Positioning API: developer.chrome.com/blog/anch

Used it to implement more accessible heading anchor links on `eleventy-base-blog` using sibling elements without a wrapper element 🏆

You can see it in action here: eleventy-base-blog-git-v9-11ty (Chrome and Edge support this, falls back to a nested link in other browsers)

Zach Leatherman :11ty:

everybody has a plan until they {get punched in the mouth, scale beyond the host’s free tier}

@990000@mstdn.social

@zachleat I've always hated this.

Also it feels like such an allegory of Twitter and Facebook and even The New York Times. It even applies to the advertising model being all fun and games... until it's not.

Zach Leatherman :11ty:

thing becomes popular because it’s free to use ♻️ popular thing goes away because it’s now too expensive to run

Zach Leatherman :11ty:

Today, the good people of the world commemorate the passing of Google Reader eleven short years ago on July 1, 2013.

To honor their memory (and in leiu of flowers) please add an RSS, Atom, JSON or equivalent feed to your web site and keep building towards a web that connects people in meaningful and positive ways.

Show previous comments
Angry Sun
@zachleat there were two good reimplementations of it, newsblur and the good reader.
Elena ``of Valhalla''

@zachleat and today people are celebrating the (earlier, 2010) birth of friendica, a fediverse platform that also supports adding rss feeds as contacts

(I don't use that feature, rss2email is a better fit for my own lifeflow, but it's nice that the option exists)

Zach Leatherman :11ty:

Framing this Twitter exchange on my wall

(sorry for the Twitter link, but it’s worth it twitter.com/karrisaarinen/stat)

Karri Saarinen: “Been wanting to update my personal site for a long time. 

Is there any extremely simple tool, kind of like Jekyll that has templates and then can churn .html pages to S3.

Or do I just need go back to notepad.exe and hand code each page.”

Lee Robinson replies: “Here's React → HTML in 20 LOC.

$ mkdir site && cd site
$ npm init -y && npm i next
$ mkdir app && touch app/layout.js
export default function RootLayout({ children }) {
  return (
    <html lang="en">
      <body>{children}</body>
    </html>
  );
}
$ touch app/page.js
export default function Page() {
  return 'Hello, Karri!';
}
$ touch next.config.mjs
export default { output: 'export' };

Add a couple `package.json` scripts...

"scripts": {
    "dev": "next --turbo",
    "build": "next build"
}

$ npm run build
$ cat out/index.html 🎉

Can upload the `out` folder to S3. Or if you want...

$ npm i -g vercel && vercel --prod”

Kaari: “Nice! Will try this”

Kaari: “This doesn’t look good” with an image attachment of the output HTML.
Show previous comments
Mike Aparicio

@zachleat This broke my fucking brain. All that to build something that looks like the first web page ever made. 🤦🏻‍♂️

GoOz

@zachleat I’m astonished by the lack of people answering how messed up it is to use React for one freaking simple & obviously static website.

Zach Leatherman :11ty:

The table shows how much of the web is being broken with the release of iOS 17.4.

via infrequently.org/2024/02/home-

Support for App-like UI, Settings Integration, Reliable Storage, Push Notifications, Icon Badging all being removed in iOS 17.4. Supported on Windows and Android.
Show previous comments
:blobcatlaptop: gravitos :blobcatcomfsip:​

@zachleat this might actually mean more native apps. less chromium in the background.

or more electron

dmitriid

@zachleat

So... Not much of the web at all then.

Don't get me wrong: Apple are assholes.

I find it sad that the whole issue revolves around one of the absolute worst things imaginable: web apps. I keep asking lamenting this one simple question and never get the answer:

1/

Zach Leatherman :11ty:

A new blog post with some important news about the future of Eleventy @eleventy

zachleat.com/web/eleventy-side

Appreciate y’all ❤️

Erik Kroes ✅

@zachleat That's too bad!
I hope it doesn't impact your employment 💚

Zach Leatherman :11ty:

Oh wow, linking npm packages with specific GitHub source versions—an exciting update 🏆

github.blog/2023-04-19-introdu

Go Up