Your Portfolio Site Is Too Slow: A 30-Minute Fix List
Sam Whitfield
17 followers
Why the first three seconds matter
Someone opens your site with fifteen other tabs in a queue behind it. If the page has not shown something readable in three seconds, they close it and you never get the second chance. The good news is that portfolios are small sites, and small sites are quick to fix because they have not had time to accumulate much weight.
The list, in order
- Compress your images. This is almost always the problem. Screenshots and photographs should be sized to the space they occupy and saved in a modern format, not uploaded at full camera resolution.
- Load images lazily below the fold. Anything the visitor has not scrolled to should not be downloaded yet.
- Cut the font pile. Two families and three weights are plenty. Each extra file is a delay on every single page view.
- Remove the animation library. A fade effect rarely justifies a library download, and CSS can carry most of what you want for free.
- Defer anything non-essential. Analytics, chat widgets and embeds should load after your actual work.
- Check what your host is doing. Caching on, compression on, and a server close to the people who will look at it.
Measure before and after
Write down the numbers from a speed test before you start, then run the same test after each fix. Watching the load time drop as you work keeps you honest and shows you which change actually mattered. In my experience the image pass alone takes a heavy portfolio from painful to pleasant.
| Symptom | Likely cause |
|---|---|
| Long blank period at the start | Big images or blocking scripts |
| Page jumps around while loading | Images without reserved space |
| Fonts flash and reflow | Too many font files or poor preloading |
| Fast first view, slow second visit | No caching configured |
What not to bother with
Do not rebuild the site, switch frameworks or chase a perfect score on a testing tool. Those are weeks of work for numbers your visitor will never see. Small, boring optimisations are what real visitors feel.
Ship it tonight
Open your site on a phone with the wifi turned off, and time how long it takes to show something meaningful. Then work the list top to bottom, retesting after each step, and stop when it loads in under three seconds. Do that once and your portfolio stops losing people at the door, which is the cheapest career improvement you will ever make.
Common questions
Why the first three seconds matter?
Someone opens your site with fifteen other tabs in a queue behind it. If the page has not shown something readable in three seconds, they close it and you never get the second chance. The good news is that portfolios are small sites, and small sites are quick to fix because they have not had time to accumulate much weight.
How do you measure before and after?
Write down the numbers from a speed test before you start, then run the same test after each fix. Watching the load time drop as you work keeps you honest and shows you which change actually mattered. In my experience the image pass alone takes a heavy portfolio from painful to pleasant.
What not to bother with?
Do not rebuild the site, switch frameworks or chase a perfect score on a testing tool. Those are weeks of work for numbers your visitor will never see. Small, boring optimisations are what real visitors feel.
