When static website isn't fast enough
Posted on December 18, 2014 • 2 minutes • 394 words
I have recently taken a look at my website loading speed again.
A bit about my website, as of currently:
-
I hosted my website on a smallest, cheapest VPS plan at RamNode ($15 per year, massive plan) which shares the physical machine with a numerous other people.
-
This website is powered by jekyll - a static site generator.
-
The website is using a custom theme, based on Bootstrap. I loaded two addtional fonts from Google Fonts (Ubuntu and Merriweather) for heading and paragraph.
-
I have Jquery and Bootstrap script on my page for some fancy stuff I might need later, along with Google Analytics script (async).
Testing
As for the testing setup, I will compare the loading speed of two posts with text only.
| Gtmetrix | Webpagetest | |
|---|---|---|
| Total load time | 2.8s | 2s |
| Size | 247KB | 221KB |
| Number of request | 14 | 17 |
| Location | Canada | US |
| PageSpeed | 98 | 96 |
| YSlow | 96 | - |
| ——————- | ———- | ————– |
| {: .table-responsive} |
2-3 seconds to load isn’t too bad itself but it’s definitely not good enough for me. My idea number would be something less than 1 second. I know that custom fonts come with the trade of loading speed but I would expect it to load faster than this, especially when they’re served by Google.
Stuff I have already tried:
-
Combine CSS into a single file, minified and served by CloudFlare.
-
Images are optimized with ImageOptim for optimal size.
-
Defer/async script when possible. Loading JS script right before
</body>tag.
Webpagetest gives my website A for everything except: First Byte Time (B) and Cache static content (C). Let’s break it down.
First Byte Time
- 845 ms First Byte Time
- 717 ms Target First Byte Time
Apparently, the VPS my website is on is slow (which is expected). I can’t do much to enhance this either.
Cache static content
Webpagetest also complains about there’s no max-age or expires set in header on fonts.googleapi.com. I have no idea why Google didn’t set max-age or expires for this. Maybe someone with better understanding about this can help explaining to me
.
As much as I would like to make my website load faster (I’m sucker for this kind of stuff), I either have to upgrade the VPS plan ($$$) or go with web safe fonts (Ewwwww!).
I guess I would have to settle with this for now. Hopefully, you don’t find this website too slow.