43 replies

1. George Rodier Bluesky 7 min later

   Ok now I'm gushing over this too. Very, very cool!

2. Private reply Mastodon 10 min later
3. Taylor “Tigt” Hunt Mastodon 13 min later

   @zachleat @jimniels @db Kroger Lite did this! It was the only way to consistently hit our page budget, and Paint Holding made it feel no less laggy than the SPA version (which was blocked on an analytics net call anyway)

   1. Zach Leatherman Mastodon 16 min later

      @tigt @jimniels @db and a lite hell yeah to that

4. Private reply Bluesky 14 min later
   1. Zach Leatherman Bluesky 20 min later

      I award this both +3 and -2 internet points

   2. Private reply Bluesky 41 min later
      1. Private reply Bluesky 41 min later
         1. Zach Leatherman Bluesky 1 hr later

            we are all iterating towards html imports

            1. Private reply Bluesky 1 hr later
5. Christian Alder Bluesky 16 min later

   Wait, we can do that!? 🤩

   1. Zach Leatherman Bluesky 24 min later
6. Ivan Čurić Bluesky 39 min later

   Bad UX if we're being honest

   1. Zach Leatherman Bluesky 1 hr later

      huh… I find it fascinating that you’ve used “we” here

      1. Ivan Čurić Bluesky 1 hr later

         That's an absolutely fair call-out, no idea why I did that.

         _I find it_ bad ux, as it isn't responsive interaction-wise.

         1. Zach Leatherman Bluesky 2 hr later

            yeah, that’s fair. There are some interaction tradeoffs happening, if folks are actively doing some <form> work you would want to warn before navigating away. Might also help to do some clever prefetching too. Looking forward to compression dictionaries which would help here too!

            1. Søren Birkemeyer Bluesky 2 hr later

               It‘s also all quite unexpected when you‘re following a screen reader, where 'invisible' details like “link menu“, the round-trips and page loads, etc. become more apparent.

               That said: All is fair in love and on personal pages. You can just do things!

7. Jim Nielsen Bluesky 41 min later

   I've ported this idea over to my icon gallery sites too

   www.macosicongallery.com

   1. Jim Nielsen Bluesky 41 min later

      I've wanted to write about this more but you know, and I've got a half-written post on how I am doing this on my icon sites, but you know....time!

      1. Zach Leatherman Bluesky 1 hr later

         half written posts can be whole posts with the right attitude (I repeat to myself)

         1. Jim Nielsen Bluesky 1 hr later

            lol, just like any pizza is a personal pizza if you believe in yourself?

            1. Zach Leatherman Bluesky 1 hr later

               it isn’t a pizza (blog post) if you don’t feel a little gross after eating (publishing)

   2. Sam Littlefair Bluesky 1 hr later

      Holy crap thats smart

8. Erik Vorhes Mastodon 42 min later

   @zachleat @jimniels @db — I love this so much. I’m putting together a legit personal site again, and I think I’ll use this approach. It feels much better than having to wrestle with a small menu on a potentially even smaller screen.

   1. Zach Leatherman Mastodon 1 hr later

      @erikvorhes @jimniels @db yeah! my personal site just… uh… leaves some things out of the small viewport nav. This is probably a better option for me too

      1. Jim Nielsen Mastodon 1 hr later

         @zachleat @erikvorhes @db any menu can become a mega menu when it's just another webpage :)

         1. Erik Vorhes Mastodon 3 hr later

            @jimniels @zachleat @db if a menu is hyperlinks on a page, doesn’t that make any page a menu?

            1. Zach Leatherman Mastodon 4 hr later

               @erikvorhes @jimniels @db

               1. Anthony Baker Mastodon 6 hr later

                  @zachleat @erikvorhes @jimniels @db This is so very cool

   2. Erik Vorhes Mastodon 22 hr later

      @zachleat @jimniels @db — also your approach to the “close” button is super elegant. (I was going to do something more complicated. Glad I inspected that element!)

      1. Zach Leatherman Mastodon 1 day later

         @erikvorhes @jimniels @db I had assumed history.back but the referrer check is :chefskiss:

         1. Erik Vorhes Mastodon 1 day later

            @zachleat @jimniels @db — agreed. I was thinking maybe enhancing it a bit, but I haven’t actually tested the change: https://gist.github.com/erikvorhes/91f36bb95f9d2855ccf72b14fcdfd626

9. Newman5 Bluesky 43 min later

   Jim says "leveraging the grain of the web."

10. Jacob Berglund Bluesky 1 hr later

    Oooh, nice. I’d even italicize that nice were it possible. That nice.

    I’m all for this simplicity. Like, a form with a method=get and some view transitions goes a long way as well. Basically free niceness.

11. Jan Miksovsky Mastodon 6 hr later

    @zachleat @jimniels @db @jimniels I was going to suggest that this seems like an ideal case for `<link rel="prefetch">` — but you've already done that!

    Might be worth calling out in a note on the post

12. Chris Armstrong Mastodon 1 day later

    @zachleat @jimniels @db how does this work when you’re scrolled halfway down long page? Would opening and closing the menu reset your scroll position?

    1. Jim Nielsen Mastodon 1 day later

       @armstrong @zachleat @db it's not sticky so you can't click it unless you're at the top of the page (so it's not a problem i tried to solve)

       1. Chris Armstrong Mastodon 1 day later

          @jimniels fair enough, am only asking because I’d love to explore using this technique but that could be an issue for my scenario. Love that this is even possible though!

          1. Zach Leatherman Mastodon 1 day later

             @armstrong @jimniels scroll position for freeeeeee as long as bfcache is in play weeeeee https://web.dev/articles/bfcache

             1. Jim Nielsen Mastodon 1 day later

                @zachleat @armstrong i keep thinking the bfcache has got to be one of the most underrated, least-taken-advantage of web platform features in a long time

                1. Zach Leatherman Mastodon 1 day later

                   @jimniels @armstrong bf stands for best friend

             2. Chris Armstrong Mastodon 1 day later

                @zachleat @jimniels well this is news to me 👀

13. The Autodidacts Mastodon 1 day later

    Yup. I used this in a client project, and it worked really well.