from Hacker News

The Import on Interaction Pattern

by pspeter3 on 12/9/20, 6:07 PM with 12 comments

  • by jkcxn on 12/9/20, 9:16 PM

    > Rather than eagerly loading the react-scroll dependency for this, they load it on interaction with the button, saving ~7KB:

    My apologies for being negative but isn't it crazy it takes 7KB to scroll to the top of the page?

  • by lhorie on 12/9/20, 11:06 PM

    Funny how we keep coming back full circle. A common optimization trick back in the day was to use pjax/turbolinks to achieve exactly this pattern. You could even go one step further and start loading on mouseover, rather than on click, giving you upwards of a one second head start.

  • by red_admiral on 12/10/20, 8:44 AM

    I'm in two minds about this.

    In favour: TTI and similar metrics are really important, not just for SEO but because Google and friends base these metrics off actual user behaviour: if your page takes to long to load, users will go elsewhere. Lazy-loading for features that are rarely used (and you've actually done the analytics to justify this) can be a valid trade-off.

    Against: this behaviour in some form has made it even into Microsoft Word. Click the "select font" dropdown and it can freeze for a couple of seconds to create the list, especially if you have a big document open. The same, if you're unlucky, for the styles dropdown, the "insert special character" button because it insists on showing you the most-recently-used ones in a menu it has to build on click (as well as in the dialog box), and a few other places.

    I expect better than this from a desktop application, especially as I remember these things being almost instant back around WinXP days. Sure it didn't come with Bing integration, but I can live without that.

    And web sites and applications should aim to emulate the responsiveness that we used to have on the desktop.

  • by jiofih on 12/10/20, 1:14 PM

    Back then we used to have index.js, chat.js, checkout.js, and so on.. even your grandma’s website had free “code splitting” and “dynamic imports”!

  • by superjan on 12/10/20, 7:18 AM

    Good advice. But really why do you need 500k extra javascript to play a video?

  • by terryf on 12/10/20, 8:03 AM

    Please don't - too many times have I loaded a number of tabs containing medium posts before stepping on a flight with no wifi and only then discovering that images a page down are not visible.

    It's fine to not load everything immediately, but load the page and then start loading all the resources, but don't wait until I scroll to the right place!