What makes a website fast should come as no surprise to anyone. But since the web is currently in so many ways a horribly slow mess it might not be a bad idea to state the obvious...
Keep Things Simple
Speed comes from simplicity (and in some very rare cases, from smart solutions). Most websites when it comes down to it are actually relatively trivial in what they do, which in part is what makes it so surprising that we manage to make them complicated and slow.
Things to Avoid
- Don't include any JavaScript you don't need (ie. do not include JQuery just to toggle some divs)
- Don't include any CSS you don't need (ie. do not include Bootstrap just to make your site responsive)
- Don't serve 2x or 3x images to people on a 1x display.
- Don't use too many fonts
- Don' use complicated CSS selectors (if you need three levels of specificity or need to make use of !important you probably messed up somewhere)
- Don't serve tons of images that the user may never see (lazy loading is easy and fast)
Things you can do to make things go faster
- Inline small scripts and styles into your pages, connection latency is a huge part of slow website performance.
- Combine all your script files into one script file, it will load faster. (Group render blocking scripts in a seperate file from deferable or async files).
- Combine all of your CSS into one CSS file. If possible put any CSS needed for "above the fold" content right in your document and load the CSS file for the rest of the page
separately.
- Serve images in the appropriate size for your visitors.
- Combine smaller images into CSS sprites.
- Simplify your CSS, use CSS stats to see how your doing
- Load images, stylesheets and scripts only when they are actually needed
- Implement modern techniques such as partial reloading to make things faster (we use it here, it works great)