RSSAmplifier

Blog

Sia Karamalegos | Blog

Freelance performance engineer and web developer, speaker, teacher, community organizer, and Google Developers Expert in Web Technologies. Available for contract consulting.

sia.codesRSS feed ↗37 posts

Latest posts

No-Code Website Builders Compared: From Landing Pages to Ecommerce

I'm a big believer that everyone should have their own little corner of the internet — a home base that reflects you, not just whatever social media platform is popular this year. Your website can be your landing page, your blog, your portfolio, or even just a single page that says, "Hey, here I am." Websites are important, but not everyone wants to learn to code. Maybe you don't have the time.…

Leveraging tech communities for your career

One of the best ways to grow your career in tech isn't just through formal training or on-the-job experience; it's by getting involved in a community. Whether you're into JavaScript frameworks, static site generators, web performance, or something entirely different, there are thriving groups of people who share your interests and want to exchange knowledge. Luckily, you have several options for…

Blogging questions

What does blogging mean to you? How do you do it? I hope this post helps you understand both a bit better or give you some ideas for your own blog. This started as a chain-blog-post, and I usually abhor tagging people in chain letters and the like. But, I liked reading Melanie Richards' blogging questions and decided to accept her generalized tag. Why did you start blogging in the first place? #…

14 web performance tips for 2025

What should you be worried about when it comes to web performance in 2025? How should you even start? I'm a web performance engineer, and I see a lot of common mistakes across the board when web developers and website owners try to understand and fix web performance, or "Core Web Vitals" in popular parlance. This post started as a Valentines-themed social media thread to celebrate a follower…

How I built Shopify Theme Vitals using 11ty and CrUX

For two years at Shopify, I helped merchants and theme developers make their online stores and themes faster. I also applied learnings from those engagements to improve the Shopify platform. I left in the summer of 2024, but I felt I had unfinished business. I wanted merchants and theme developers to have a better resource for understanding the real-world performance of Shopify themes. And, I knew…

My top content in 2024

2024 was a transitional year for me. I spent the first half of this year working at Shopify, and in the latter half I went freelance again. Being a freelancer is great in terms of freedom, so I am able to branch out a bit more now. Top Shopify web performance content # Most of my top content was really the posts I wrote on performance.shopify.com . Luckily, the folks still there gave me the data…

Dynamic social share images using Cloudinary

Did you ever notice those social media share images that automatically pop up for a site and think to yourself, "wow, it would be really cool if I could get that set up for my blog"? In this post, I will show you how I use 11ty shortcodes and Cloudinary to generate unique share images for each page and blog post on my site. Cloudinary has a free tier that's generous enough that most personal sites…

Migrating from Netlify to Cloudflare for AI bot protection

I'm an independent content creator that uses my content partly as a way to to get interest in my paid services. I don't know about you, but for me the idea of an AI LLM scraping my content to regurgitate it without any benefit to me seems like a dumb business decision. When Cloudflare announced their new service to block AI bots, scrapers, and crawlers , I was intrigued. Many folks are playing…

How to optimize Cumulative Layout Shift (CLS) on Shopify sites

This post was originally published on the Shopify performance blog . Cumulative Layout Shift, or CLS, is a measure of how much a webpage shifts unexpectedly. It is a user experience metric that helps us understand how frustrating a page is. Think of the last recipe you were trying to read - you’re a few paragraphs in, and suddenly you lose your place because ads popped in above where you were…

How I converted speaking content to written with AI

If you've ever approached a blank page with an idea for a long blog post, you'll understand me when I say that it can be daunting. I can't count how many times I've though to myself "maybe I should go get a snack" while staring at that blank page. We'll do anything to procrastinate that step. This time, I decided to try something new. I recently published a massive blog post about the common…

Debugging common causes for slow loading in Shopify Liquid storefronts

This post was originally published on the Shopify performance blog . Have you ever been confronted with the daunting task of figuring out what exactly is causing a page to load slowly? Each page can suffer from hundreds of potential issues when it comes to page loading speed. Maybe you’ve experienced this first-hand with an endlessly long Lighthouse audit. No one wants to try optimizing 10…

Responsive images on Shopify with Liquid

This post was originally published on the Shopify performance blog . 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. Getting images right has always been a struggle. We get new features, formats, and strategies each year, making it hard to keep up with the…

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. Creators may or may not be able to afford those fees depending on their sales volume. How could we build a site with the lowest hosting costs possible? Matthew Ling from Stripe and I brainstormed how to do this and then built it in a series of livestreams. This article is a collection of all the resources we created:…

Build that blog already

This week I held a mini-workshop called Let's build and deploy your blog already . It was unexpectedly popular. I suspect this is because as humans, we all tend to procrastinate, and workshops are a great opportunity to finally get that to-do checked off. I am a freelance developer and performance engineer. I now get more new clients from conversions on my blog than through word of mouth. It took…

An Informal Survey of Web Performance Tooling in 2021

Sometimes it's hard to discover all the great web performance measurement tools out there. What are performance engineers using in 2021? What tools do they want to use? I set out to answer these questions by creating a survey. I shared this survey with the web performance engineering community. It's not statistically perfect (27 responses), but I still found it insightful. I also learned a lot for…

Explore JavaScript Dependencies With Lighthouse Treemap

Lighthouse Treemap is a new tool that helps us evaluate the efficiency of the JavaScript on our websites. It shows us: The bytes of JavaScript by file If sourcemaps are enabled, the bytes of JavaScript by module Bytes of JavaScript used versus unused (execution) for page load JavaScript is often the biggest culprit when it comes to poor web performance. This tool can help us find our biggest…

What to know about AVIF on Cloudinary

I just enabled AVIF on Cloudinary and... WOW. My image file sizes dropped by around 37-50% with equal quality. Most of how to use AVIF on Cloudinary is covered by How to Adopt AVIF for Images With Cloudinary by Eric Portis. In this post, I want to cover some gotchas and things to know. What is AVIF? # Before we get started, let's get the back story. AVIF is a new image format derived from the…

#30DaysOfWebPerf: The Pros and Cons of a Twitter series

In November of 2019, I decided to try out a new way to deliver web performance tips to my Twitter followers. Learning web performance can be overwhelming, so I focused on small bits of information. Thus was born my #30DaysOfWebPerf series. Twitter is great for small bits of info, right? Well, it was great in some ways and not so great in others. I'll tell you why in this post. You can see the full…

How to Eliminate Render-Blocking Resources: a Deep Dive

You might be here because Lighthouse told you to "eliminate render-blocking resources". Render-blocking resources are a common hurdle to rendering your page faster. They impact your Web Vitals which now impact your SEO. Slow render times also frustrate your users and can cause them to abandon your page. I worked with one client to reduce their render-blocking resources and improved their site…

Going Intergalactic with Serverless Functions on Netlify

This post is a companion to the talk I give on buidling serverless functions with Netlify ( slides ). I usually give it to groups newer to web development such as bootcampers. My goal here is to give a step-by-step tutorial for those wanting to duplicate my demo, or anyone interested in an intro tutorial on the topic! This post will walk through: Setting up your first Netlify deploy through GitHub…

Itsiest, Bitsiest Eleventy Tutorial

I like to talk and write about Eleventy a LOT. I always run into this problem of having to introduce Eleventy to people not familiar with it in a short way. So, I wrote up this miniature demo to give people a flavor of Eleventy without overwhelming them with all the details. If you like it as much as I do, maybe it will inspire you to learn more! Do you prefer learning by video? I included a…

Adding Prettier to a Project

While working at a smaller dev shop, our team hit the point at which the inconsistent code formats between and within projects was becoming a pain. Our needs included: A consistent linter/formatter for all projects in a particular language An autoformatter so developers didn't spend time "fixing" linter errors A tool readily available in tools like VS Code which could apply changes on save We…

Faster YouTube embeds in Eleventy

Video is great, but the default YouTube embed share is both bloated and not privacy-minded. I finally switched my YouTube embeds to lite-youtube-embed by Paul Irish , and it's fantastic. It loads "faster than a sneeze" and uses the no-cookie version by default. This post will explain how to set up a reusable lite-youtube-embed "component" using Nunjucks partials in an Eleventy project. Lighthouse…

Optimize Images in Eleventy Using Cloudinary

Responsive images can be challenging to set up, from writing markup to generating the images. We can make this job much easier by using Cloudinary and Eleventy. Cloudinary can host and transform our images, making generation of many file formats and sizes a matter of adding a param to a URL. Eleventy is a hot JavaScript-based static site generator. It requires no client-side JavaScript, making it…

Webmentions + Eleventy Talk

Webmentions are an exciting standard which help enable the IndieWeb. We can own our own content, hosted on our own domains, without sacrificing social connection and replies with other people! In this talk, I discuss what webmentions are and how to implement them. In the longer version for Magnolia.js , I also give a quick demo of Eleventy. The code is based on an Eleventy site, but the concepts…

Architecting data in Eleventy

Eleventy is a static site generator that makes building static, performant websites a breeze. It uses JavaScript to build pages at build time, but does not require any JavaScript in the client to render them. Eleventy's magic comes with powerful tools for data, but the data model can be a lot to conceptualize when you're new to Eleventy. In this post, I'll explain the hierarchy of the data that we…

Vintage Bundles talk at Magnolia JS

More developers are starting to understand that web performance matters. From higher mobile search rankings to bottom-line revenue impacts, performance can make or break your web app. However, fixing performance can feel like a quagmire of expert-level nuanced understanding on so many topics. What would you think if I told you you could cut your JavaScript bundle size up to 50% by doing one thing…

Responsive, Performant Images for the Web

Want to learn how to make your images more responsive and more performant? Haven't gotten a chance to read that book/article/doc on web performance for images yet? I spoke at my first virtual conference, PerfMatters Conf, and luckily they recorded it. This talk is a great intro into all things images for the web. Enjoy! Images account for 50% of the bytes downloaded to load a website. How can you…

How to build a website in 2021

Step 1 : Buy a domain. You might have a problem if you already have 20 domains waiting to be used, but that's okay. Feel free to buy more domains. You never know when you might need that perfect domain name. P.S. Vercel has a great domain search tool with hacks. Now I've just enabled your habit. You're welcome. Step 2a : Engage in Twitter debates about how JavaScript is ruining the web and which…

Show conditional Twitter intents with Eleventy

In today's episode of Making Sia's Blog Better™️, I wanted to better encourage readers to engage in the conversation about my blog posts. I used Eleventy to build my blog and recently added Webmentions , which are a really cool way of making self-hosted blogs a bit more engaging without implementing comments. You can check them out at the bottom of this page. Currently, most of the interaction…

An In-Depth Tutorial of Webmentions + Eleventy

I am a huge fan of the static site generator Eleventy so far, and I was super excited to try out Webmentions with them. Webmention is a web standard for mentions and conversations across the web, a powerful building block that is used for a growing federated network of comments, likes, reposts, and other rich interactions across the decentralized social web. —from IndieWeb.org They are a cool tool…

Justifying performance improvements using Google Analytics

Many of us who love the web and want to make it fast feel like we’re shouting out into the ether that performance matters , but I’m not sure anyone is listening. We write articles, give talks, organize whole conferences, and we even have a hashtag (#PerfMatters)! But, many companies still don’t listen. It’s not their fault necessarily. The business doesn’t care about having a fast site. It cares…

Making Google Fonts Faster in 2022

In this article, I will show you how to: Choose the best way to import your Google Fonts Skip over some of the latency time for downloading fonts Fix flash-of-invisible text (FOIT) Self-host your fonts for faster speed and greater control Struggling with web performance? Failing your Core Web Vitals? I'm here to help. Check out my services or contact me today to get started. Anatomy of a Google…

My adventures in turning a Pixelbook into a developer machine

Today the FedEx man delivered my brand new Pixelbook. So much fun! I got this little tool to attempt to get off of the Mac platform without going full Linux distro. For the most part, I do web development and only need (1) a terminal, (2) an editor, preferably VS Code, and (3) a browser. Since Chrome OS deployed the new Linux beta, all these things are now possible with fewer install headaches…

Google Analytics + caniuse = *MAGIC*

Today I learned that you can import your Google Analytics data into caniuse to determine how many of your users would be able to use a particular front-end technology in their browser of choice. Maybe the rest of you have been holding out on this and just didn’t tell me. Maybe I had my head in the sand. Well, today I learned about it, and it’s amazing. At Clio + Calliope , we are really excited…

What finally pushed me to learn to code

The UPS guy just knocked. Pandemonium ensues. After corralling the dogs, I fetch the brown envelope from my mailbox. I had been waiting for this package from my stepmom but had forgotten about it. I bring it inside and open it. My father’s old passports slip out and into my hands. It has been almost three years since we lost him. Enough time has passed that I can look on pictures with fondness and…

Rails folder tree explained

Sometimes you just don’t like any one particular reference out there. This happened to me when I was trying to build lesson content for our first lesson on Rails. Oh, by the way, I’m teaching a coding bootcamp here in New Orleans right now (fun stuff!). To summarize, I found a lot of different content explaining the folder tree and files for Rails, but no one particular source spoke to me above…