top of page

Speed Up a Photo Heavy Roaster Site: Images and Apps

Writer: Thomas Garner
Thomas Garner
Oct 7
11 min read
Laptop with code, plant, and mug on desk

Your roaster site is full of large product photos, roast day videos, maybe a widget or two pulled in from an app you installed months ago, and someone finally told you the site loads slowly on a phone. You have been told to compress images. Nobody told you which images, which apps, or in what order to fix them.


Short answer: on a photo heavy roaster site, the biggest gains almost always trace back to a short list of causes, oversized hero images, too many product images loading at once, and apps that quietly add scripts to every single page whether they are needed there or not. Measure first, then fix in that order, and you will get most of the improvement available without touching anything else.


This post stays separate from a full site audit checklist, which scores everything at once, and from posts comparing commerce platforms generally. It is narrowly about speed on an image heavy site, grounded in Google's own documentation on page experience, not in any claim about how much a faster site will move your search ranking.


Measure Before You Touch Anything

Before compressing a single image or removing a single app, run your homepage, one product page, and one collection page through PageSpeed Insights, a free tool at pagespeed.web.dev, on the mobile setting specifically, since mobile is where slow, image heavy sites suffer the most. Record the results with the date, since these numbers drift over time and a stale measurement is worse than no measurement.


The report gives you three headline numbers worth understanding: Largest Contentful Paint, which measures how long the biggest visible element takes to load, Interaction to Next Paint, which measures how responsive the page feels once a visitor tries to tap or scroll, and Cumulative Layout Shift, which measures how much the page jumps around as it loads. Google publishes these as its Core Web Vitals, and the current guidance is worth reading directly at web.dev rather than relying on a secondhand summary, since the exact thresholds are the kind of detail that benefits from being checked at the source.


Below the headline numbers, the tool also lists specific opportunities, often things like properly size images or reduce unused JavaScript, ranked roughly by how much time they could save. This list is your actual fix order, generated for your specific pages rather than guessed at generically, and it is far more useful than any generic checklist, because it reflects what is actually slow on your site rather than what is commonly slow on sites in general.


Do this on all three page types, not just the homepage, because a product page loaded with several large images can behave very differently than a homepage with one big hero image, and a collection page loading dozens of thumbnails at once has its own distinct failure pattern. Fixing only the homepage while ignoring your product and collection pages leaves real, measurable slowness in place exactly where photo heavy roaster sites tend to be slowest.


Images: The Usual Biggest Win

The single most common cause of a slow, photo heavy site is an oversized hero image, a large photo at the top of a page that is far larger in pixel dimensions or file size than it needs to be for how it actually displays on screen. A photo shot at full camera resolution and uploaded directly, without resizing, is a common and easily fixed culprit, and it is usually the first thing worth checking.


Modern image formats matter here too. Formats like WebP or AVIF compress meaningfully better than older formats like a standard JPEG at a comparable visual quality, and most current website builders serve these modern formats automatically once an image is uploaded, converting behind the scenes without you needing to do anything manually. Check your specific platform's documentation on image handling to confirm what it does automatically and what, if anything, still requires a manual step on your part.


Too many product images loading at once on a single page is the second common cause, particularly on a collection page trying to show a full catalog with a large thumbnail for every item. Where your platform supports lazy loading, meaning images below the visible part of the screen load only as a visitor scrolls toward them rather than all loading immediately, confirm it is turned on, since some builders default to loading everything up front unless you specifically enable lazy behavior.


For roast day videos specifically, treat them the same way as oversized images: a video embedded to autoplay at full resolution the moment a page loads is one of the heaviest things you can put on a page. Consider whether the moment needs autoplay, or whether a lightweight preview image the visitor taps to play achieves the same storytelling goal without loading the full video file for every single visitor, including the large share who never watch it.


Apps: The Quiet Second Cause

An app or widget installed on a builder like Wix, Squarespace, or Shopify often adds its own script to every page of your site, not just the page where you use the feature. A chat widget added for customer questions, a review display app, a marketing pixel installed once and forgotten, each one adds weight to every page load whether or not a visitor on that particular page ever interacts with it.


Each platform documents how to review and manage installed apps or extensions differently, and it is worth reading the current help page for your specific platform rather than guessing at the interface, since the exact path to view and disable an app changes as these platforms update their own admin tools. The core idea is the same everywhere though: open your list of installed apps, and for each one, ask honestly whether it is still doing something you need.


An app you installed for a one time promotion months ago and never removed is a common, easy find once you go looking, and disabling anything you are not actively using is close to a free improvement, since it costs nothing but a few minutes of review and removes weight from every single page load going forward.


For apps you do genuinely need, check whether your platform lets you limit where a script loads, for instance restricting a chat widget to only the pages where a visitor might want to start a conversation rather than loading it globally across every product and collection page on the site. Not every platform supports this kind of restriction, but where it is available, it is worth using.


The Fix Order

Once you have your PageSpeed Insights results for all three page types, work through causes in this order, since each one tends to deliver the biggest win relative to the time it takes: first, resize and properly format your largest hero images, which is usually the single fastest fix with the largest visible impact. Second, confirm lazy loading is enabled for product and collection page thumbnails, so a page with many images is not forcing every single one to load immediately. Third, review your installed apps and remove or restrict anything not earning its place on every page.


This order is not arbitrary. Oversized images are almost always the single biggest contributor to a slow Largest Contentful Paint score, so fixing them first produces the most visible improvement for the least effort. Apps tend to affect interactivity and overall page weight more subtly, which is real and worth fixing, but usually delivers a smaller marginal gain than the image work, especially on a site whose problem is primarily photo heavy pages rather than a particularly script heavy app stack.


After making these changes, run the same three pages back through PageSpeed Insights and compare the new results to your first measurement, dated the same way. This closes the loop honestly: you now have a before and after specific to your own site, rather than a general claim about how much any of this typically helps, which nobody can state reliably without measuring the specific site in question.


What This Post Does Not Claim

Hillcane has no speed measurements across the broader census of independent coffee shop sites we have looked at, so nothing here claims a typical or average load time for a roaster site, and nothing here promises that a faster site will move your search ranking by any specific amount. Google has said that page experience is one of many factors it considers, but translating that into a guaranteed ranking outcome for your specific site is not something any honest source can promise.


What this post can promise is narrower and more useful: a documented, repeatable way to measure your own site, identify the actual causes of slowness on your specific pages, and fix them in an order that reflects where the biggest, cheapest wins usually live on a photo heavy roaster site. That is a real, achievable outcome, distinct from any speculative claim about traffic or ranking.


Platform Notes Worth Knowing

On Wix, image handling and app management both live inside the site dashboard, with automatic image optimization applied to most uploads and an apps panel where every installed app can be reviewed and disabled individually. Wix's own help documentation covers the current specifics of both, and since the dashboard layout and available settings shift as the platform updates, it is worth reading that documentation directly rather than relying on a description that may already be slightly out of date by the time you read it.


On Squarespace, image handling is largely automatic once a photo is uploaded through the standard image blocks, with the platform generating multiple sizes and serving an appropriate one depending on the visitor's screen. Extensions and third party integrations are the more common source of added script weight on Squarespace sites, so reviewing what is connected under the platform's extensions or connected accounts settings is the equivalent of the app review described above.


On Shopify, apps installed from the app store are the most common source of extra page weight, since many apps inject their own script into every page of a storefront by default regardless of theme. Shopify's help documentation covers how to review installed apps and, for some apps, how to control where their code loads, and it is worth checking whether a given app offers that kind of granular control before assuming it must run everywhere.


Across all three platforms, the underlying principle is identical even though the specific menus and settings differ: images should be sized and formatted efficiently, most of which modern builders now handle automatically, and every installed app or extension deserves a periodic, honest review asking whether it still earns the weight it adds to every page load.


A Simple Ongoing Habit

Speed is not a one time fix you complete and forget, especially on a site that keeps adding new product photos, new roast day content, and the occasional new app trial over time. Build a habit of rerunning PageSpeed Insights on your homepage, one product page, and one collection page every few months, the same way you might periodically check that your hours are correct or that your menu prices match what you charge.


Pay particular attention right after any significant change: a new round of product photography uploaded at full resolution without resizing, a new app installed for a seasonal promotion, a homepage redesign that adds a new hero video. These are exactly the moments when a site's speed tends to quietly regress, often without anyone noticing until a customer mentions the site felt slow on their phone.


Treat the fix order from this post as something to revisit each time you check, not just something you do once. A site that was fast six months ago can slowly accumulate the same kinds of weight described here, one oversized photo and one forgotten app at a time, until it needs the same measure first, fix in order approach all over again.


Related Reading

More from Hillcane on this topic, plus the pages on the site that sit next to the work.


Frequently Asked Questions

What is the single most common cause of a slow roaster site?

An oversized hero image, meaning a large photo displayed at the top of a page that is far bigger in file size or pixel dimensions than it needs to be for how it actually appears on screen. This is usually the first thing worth checking and often the fastest fix with the biggest visible improvement.


Where do I measure my site's actual speed for free?

PageSpeed Insights, Google's free tool at pagespeed.web.dev. Run it on the mobile setting for three pages, your homepage, one product page and one collection page, and write down the date. It reports Largest Contentful Paint, Interaction to Next Paint and Cumulative Layout Shift, plus a ranked list of opportunities, such as properly size images or reduce unused JavaScript, for that exact page. That list becomes your site specific fix order.


Do image formats like WebP make a difference?

Yes, generally. WebP and AVIF compress meaningfully better than a standard JPEG at comparable visual quality, and most current builders convert uploads to these formats automatically. Squarespace, for example, generates several sizes from each upload and serves one suited to the visitor's screen. Format alone will not rescue a hero photo uploaded at full camera resolution, though, so resize oversized images first and confirm your platform's image handling in its own help pages.


How do apps and widgets slow down a site?

An installed app or widget often adds its own script to every page of your site, not only the page where its feature is used. A chat widget, a review display tool, or an old marketing pixel each adds weight to every load, whether or not a visitor on that particular page interacts with it at all.


What order should I fix these problems in?

First, resize and properly format your largest hero images, usually the biggest single cause of a slow Largest Contentful Paint score. Second, confirm lazy loading is on for product and collection page thumbnails, so a full catalog page does not load every image at once. Third, review installed apps and remove or restrict anything not earning its place on every page. Then rerun PageSpeed Insights on the same three pages and compare.


Will a faster site improve my search ranking?

No specific ranking effect can be promised, and this post makes no such claim. Google describes page experience, including the Core Web Vitals published at web.dev, as one of many factors it considers, not a guaranteed outcome. What you can measure honestly is your own before and after: dated PageSpeed Insights results on the same homepage, product page and collection page, which show whether the fixes made your pages load faster.


Should I autoplay roast day videos on my homepage?

Consider a lightweight preview image that visitors tap to play instead. An autoplaying roast day video at full resolution is one of the heaviest things a page can load, and every visitor downloads it, including the many who never watch it. A tap to play preview keeps the storytelling for interested visitors while protecting Largest Contentful Paint on the homepage. Check the result against your dated PageSpeed Insights baseline afterward.


How do I know if lazy loading is turned on for my product images?

Check your platform's own help documentation on image settings, since defaults differ between Wix, Squarespace and Shopify, and some builders load every image up front unless lazy loading is specifically enabled. Collection pages showing a large thumbnail for every item in the catalog are where this matters most. Run one through PageSpeed Insights on mobile before and after changing the setting, and date both results so you can compare them honestly.


Does Hillcane have data on typical speed across coffee shop sites?

No. Hillcane has no speed measurements across the census of more than 1,000 coffee shop sites it reviewed, so this post claims no typical or average load time for a roaster site. It offers a documented method instead: dated PageSpeed Insights runs on three page types, a fix order of hero images, then lazy loading, then apps, and a rerun of the same pages every few months or after major changes.


Can Hillcane help measure and fix a slow roaster site?

Yes. Hillcane can run dated PageSpeed Insights measurements on your homepage, a product page and a collection page, then work through the fixes in order: oversized hero images, lazy loading for thumbnails, and a review of installed apps on Wix, Squarespace or Shopify that add scripts to every page. Afterward the same pages get retested for an honest before and after. Reach out at hillcane.co/contact or call (256) 384-2449.


Work with Hillcane

Oversized hero images and one script heavy app usually explain most of a slow roaster site. Measure first, then fix in that order.


If you want help measuring and speeding up your roaster site, reach Hillcane at hillcane.co/contact or call (256) 384-2449.

Comments


bottom of page