2
13 Comments

Chrome page audits have me worried…

TL;DR: moving my landing page from self-hosted to an all-in-one took my page performance rating from 90 to 35. Am I overly concerned with this?

Back when my landing page was just a landing page, I self-hosted everything on a Digital Ocean droplet. Whenever I ran Chrome audits on my page, I made sure to keep things green (90+) across the board (Performance, Accessibility, SEO, and Best Practices).

Given that there are so many disparate parts to running and operating an online storefront, I felt the best course of action was to move everything over to an all-in-one commerce solution for up-front simplicity and long-term flexibility.

Next month, I'll be adding over a dozen new products to the store. By the end of the year, I'll be adding twice that every month. Having the all-in-one handle a lot of the minutiae (scheduling, blog, publishing calendar, sales events, autopilot everything) isn't just appealing to me, it's a must-have. I realize I could hook everything together on my own stack, but I lack the luxury of time (prior contracts & commitments, etc.).

Here's my issue: the Performance aspect of my Chrome audit has absolutely tanked. Whereas I used to score in the high 80s/low 90s, I'm now consistently in the mid-30s. Ouch. The bundled scripts from the all-in-one nearly doubled my time to first render!

Am I wrong to be concerned? Are Chrome audits as big of a deal as I've made them out to be in my head?

For reference: https://prismatext.com

  1. 2

    From a user perspective, I think you're probably ok. For me, page loaded in about 2 seconds, which is fine.

    I ran the lighthouse audit too, so I can see why you're concerned. I honestly don't know how lighthouse works. It says your FCP is 5 seconds and 15 seconds to interactive. My actual experience was more like 2 second load, 3 seconds to interactive. I don't know why there's such a large difference.

    Obviously the js and css are bloated, but there may not be much you can do about that.

    I think one of the problems is that all your JS is in the header so it's blocking.

    Maybe see if you can move it to the footer so it's non-blocking?

    I'm not familiar with Squarespace but maybe you can use this https://support.squarespace.com/hc/en-us/articles/205815908-Using-Code-Injection
    to get the JS into the footer?

    I also found this, which unfortunately makes it sound like optimizations will be difficult or impossible:
    https://dev.to/codenutt/how-i-reduced-load-time-by-25-on-squarespace-and-why-i-couldn-t-get-more-7gg

    Again from a user perspective, I think you're ok. Not great, but fine.

    The main concern I have is whether this puts you at an SEO disadvantage if you think SEO is an important channel for you.

    Good luck!

    1. 1

      Unfortunately, all of that JS in the header is part of Squarespace's payload; I only have three things I inject manually, two of which are links with preconnect attributes (which I guess saves me a few hundred ms).

      I appreciate you looking into this as a user. I think that's my main concern—obviously there will always be technical things I'd want to implement, like better/more selective bundling, but my main concern will always be what users feel. My girlfriend, a self-described luddite, didn't seem to bothered by my Google Lighthouse score either.

      And you're right: one of the main reasons I'm using SS is the fact that it does a lot of behind-the-scenes magic for SEO. As a one-man operation, I just don't have the kind of time I need to focus on every single little area…especially when I already have two other jobs/contracts!

      1. 2

        If SS simplifies your operation and works for you, then I wouldn't worry about the lighthouse score. I'm sure you considered other options like Shopify or Gumroad. I honestly don't know if they are better for you or not.

        I know you're still working on the site, but I have a few suggestions for you:

        1. I think you should have a section on your homepage that displays some book covers that link to the book pages. First, that will help orient visitors on the purpose of the site more quickly (buying books). Second, it will drive more visits to book pages and therefore more sales.
        2. I like the animated previews on the book pages. You should incorporate them on your homepage. I like it better than your current "how it works".
        3. In general, it was confusing to understand what your product is. If I understand correctly, you are selling ebooks in epub/mobi formats that insert foreign language snippets into books with a feature to click on the words to see their meaning. But originally, I thought your product was some sort of mobile app or web app because I didn't see epub or anything else that looked like an epub on your home page. Your "how it works" should show you actual product, animated pages from the ebook ... instead it made me think that the stories were going to be on a web-page or web-app because that's what is there.
        4. On your book pages, your CTA should be "Add to Cart" not "Purchase". "Purchase" should be for the final purchase action when the payment is made.

        Hope this helps, and good luck!

        1. 1

          Based on feedback from you and others, I completely redid my website. Ditched Squarespace in favor of Shopify, got performance back around ~70, and now it actually looks and feels like a bookstore. I wasn't happy I had to switch, but I'm so glad I did. Thanks again for your insights :)

          1. 2

            Good stuff, keep up the great work!

        2. 1

          This is fantastic feedback. Thank you for the suggestions and advice—I'll be doing some updates this week!

          1. 1

            One other thought – you may want to experiment with different content types. As someone who took 6 years of Spanish in middle/high school, I do wish I could brush up on my language skills, but I'm not really interested in reading fiction books. I'd be more interested in reading news articles, blog posts, non-fiction, etc.

            As a busy person, short form is better than long form.

            Also, even though I have ebook readers, I'd rather read in the browser because that's where I usually am. Downloading epubs to my reader is an inconvenience. In fact, my preferred delivery would be a short (say 5-8 minute read) delivered via email, then I click on a link and it takes me to a web page or web app where I can read.

            You've probably had these ideas before, but that would be my preferred approach.

            I'm sure you have a lot going on. Good luck!

            1. 1

              That's something I want to explore!

  2. 2

    Your site load speed is pretty fine, the biggest problem I see is content flashes and layout changes while the page loads.

    The content position should never change during a page load as it adds a huge cognitive load and it vastly increase the initial time it takes to understand what's the page about.

    1. 1

      This sounds at least a little actionable on my part. Thanks for checking in! I appreciate the feedback.

  3. 2

    Your HTML is a huge mess.

    What are you using?

    1. 1

      Yuuuuuuuuup exactly. I'm using Squarespace…it's one of their "default" templates.

      Prior to this, I had a nice, neat little 15kb CSS file via Tailwind and about that same amount in my JS bundle.

      1. 1

        Yep welcome to bloatware.

        The bounce rate will be crazy high

Trending on Indie Hackers
How I grew a side project to 100k Unique Visitors in 7 days with 0 audience 49 comments Competing with Product Hunt: a month later 33 comments Why do you hate marketing? 28 comments My Top 20 Free Tools That I Use Everyday as an Indie Hacker 15 comments $15k revenues in <4 months as a solopreneur 14 comments Use Your Product 13 comments