Building a Serverless E-commerce Store with Stripe, Netlify, & 11ty
Building the lowest-cost e-commerce solution with static site generation and serverless functions
Blog
Learn about web performance, Eleventy, and the Jamstack.
See select posts, all posts, or filter by topic
Filter by topic
Analytics Content Dev Tools Eleventy External Fonts Images IndieWeb Jamstack JavaScript newsletter Personal Popular Rails React Tools Video Web WebPerf
Select posts
An Informal Survey of Web Performance Tooling in 2021
What tools are web performance engineers using to measure site speed in 2021?
Explore JavaScript Dependencies With Lighthouse Treemap
Discover all JavaScript downloaded for a site and used vs unused in a handy data visualization.
How to Eliminate Render-Blocking Resources: a Deep Dive
Is Lighthouse telling you to eliminate render-blocking resources? Learn what it means and how to fix it.
Itsiest, Bitsiest Eleventy Tutorial
Want to get started with Eleventy but feel overwhelmed? Try out this pared-down tutorial
Optimize Images in Eleventy Using Cloudinary
Set up responsive images in Eleventy using Cloudinary and Eleventy shortcodes
Architecting data in Eleventy
Setting and using data in the static site generator Eleventy
An In-Depth Tutorial of Webmentions + Eleventy
Add Webmentions to your Eleventy static site with this step-by-step tutorial.
Making Google Fonts Faster in 2022
If you use Google Fonts, a few additional steps can lead to much faster load times.
All posts
Why web performance still matters in 2023
The web performance community often says that performance matters, but why is that? Does it truly matter? What are the reasons? Whether you're new to this topic or want to better understand the arguments, this article is for you.
Published on Performance at Shopify
A countdown of my top 5 favorite web performance tools
Much like a carpenter or handyperson, every web performance expert has a set of their favorite tools. Whether you’re new to performance or simply wanting to snoop on other people’s processes, here’s my own toolbox favorites and why.
Published on Planet Performance
Optimizing images for performance on Shopify
Images are key to user experience, especially in ecommerce. Making images smaller doesn't always result in better performance. In this post, I focus on how images can impact page load speed and layout shift.
Published on Performance at Shopify
Responsive images on Shopify with Liquid
Responsive images are important for both user experience and site speed. Get them right, and your users will be more likely to convert. Get them wrong, and you may cause your site to be slow.
Published on Performance at Shopify
Lazy load images for performance
Lazy loading is a performance strategy that de-prioritizes assets like images that are not needed immediately after a webpage is loaded. As with any strategy, you can misuse it causing worse performance.
Published on Performance at Shopify
Fix web performance for the long-term
At Shopify, we’ve seen what works and what doesn’t work when companies want to improve their web performance. We want to share with you our top learnings to get you on the path of success.
Published on Performance at Shopify
Building a Serverless E-commerce Store with Stripe, Netlify, & 11ty
A lot of e-commerce solutions exist, but many of them charge a monthly fee. How could we build a site with the lowest hosting costs possible?
Web Almanac 2021: Performance
The state of web performance in 2021 including the Core Web Vitals (LCP, CLS, FID) as well as FCP and TTFB for the top ~8M websites.
Published on Web Almanac by HTTP Archive
Build that blog already
What's holding you back from starting your blog? Sort through the real issues from the noise and start today.
An Informal Survey of Web Performance Tooling in 2021
What tools are web performance engineers using to measure site speed in 2021? Learn which are the most used tools as well as some new tools to try out.
Explore JavaScript Dependencies With Lighthouse Treemap
Discover all JavaScript downloaded and used/unused for a site in a handy data visualization with Lighthouse Treemap.
What to know about AVIF on Cloudinary
Start using AVIF today with Cloudinary. Learn about your options, the tradeoffs, and how to overcome slow transformations.
#30DaysOfWebPerf: The Pros and Cons of a Twitter series
My experiment with 30 days of web performance tips. All packaged up for your temporary viewing pleasure. Results from a Twitter series by Sia Karamalegos.
How to Eliminate Render-Blocking Resources: a Deep Dive
Is Lighthouse telling you to eliminate render-blocking resources? Learn what this means, why it's important, and how to fix it in your HTML, CSS, and JavaScript.
Going Intergalactic with Serverless Functions on Netlify
Get started going serverless with Netlify functions and Netlify-CLI for keeping secrets secret
Itsiest, Bitsiest Eleventy Tutorial
Want to get started with Eleventy but feel overwhelmed? Try out this pared-down tutorial
Adding Prettier to a Project
Add Prettier with a pre-commit hook and dedicate one commit to a full reformat
Faster YouTube embeds in Eleventy
Use lite-youtube-embed in Eleventy for faster and more privacy-minded video
Optimize Images in Eleventy Using Cloudinary
Learn the fundamentals behind responsive images and how to set them up in Eleventy using Cloudinary and Eleventy shortcodes
Webmentions + Eleventy Talk
Slides and resources from my talks at JamStack Toronto and Magnolia JS.
Architecting data in Eleventy
Setting and using data in the static site generator Eleventy
Vintage Bundles talk at Magnolia JS
What are some strategies for serving modern JavaScript to modern browsers?
Responsive, Performant Images for the Web
Learn to optimize your images for the web in this video from PerfMatters Conf.
How to build a website in 2021
It's really easy.
Show conditional Twitter intents with Eleventy
Encourage users to retweet or share a post based on whether a Tweet already exists for your blog post.
An In-Depth Tutorial of Webmentions + Eleventy
Join the Indie Web by adding Webmentions to your serverless Eleventy static site with this step-by-step tutorial. No client-side JavaScript needed!
Justifying performance improvements using Google Analytics
Trying to convince your company to make site load speed improvements? Maybe Google Analytics can help.
Making Google Fonts Faster in 2022
If you use Google Fonts, a few additional steps can lead to much faster load times. Learn about preconnect, optimal placement, font display, preload, and more in this post.
My adventures in turning a Pixelbook into a developer machine
With the Chromebook Linux beta, web development got a whole lot easier.
An Introduction to Drupal for React Developers
Explore Drupal from the perspective of a React developer looking to familiarize themselves with Drupal and its capabilities
Published on React ❤ Drupal (Osio Labs)
8 Things to Know About React for Drupal Devs
Get a taste of why developers are so happy with React and learn about how some of the concepts are similar or different from the Drupal and PHP world
Published on React ❤ Drupal (Osio Labs)
Google Analytics + caniuse = *MAGIC*
Import your Google Analytics data into caniuse for detailed feature support for your users.
What finally pushed me to learn to code
Finding inspiration through personal grief
Rails folder tree explained
Descriptions of the auto-generated folders in Rails 4.2