Curious about how dynamic websites, such as those built on WordPress, operate? It all starts when a visitor enters your URL into their browser or clicks a link to access your site. The browser sends a request to your web server, which retrieves the necessary data via database queries and generates an HTML file to display in the visitor's browser.

Unlike dynamic sites, static sites store responses as flat files on the server, delivering them instantly to visitors. Although static site generators have been in use for some time, they've recently gained popularity

What's Gatsby?

Have you heard of Gatsby? Typically, WordPress creates dynamic websites requiring a PHP, MySQL and Apache or Nginx stack on the server to operate. However, you can convert WordPress into a static version by generating a list of HTML pages for all site content.

This headless or serverless WordPress version is only converted once, enabling the same page to be served to visitors repeatedly. But how do you change your WordPress site to a static version? Enter Gatsby.

GatsbyJS is a static site generator powered by GraphQL and built with ReactJS. It enables the creation of feature-rich, captivating websites and apps by fetching data from various sources such as existing sites, API calls and flat files through GraphQL. Gatsby builds the static site based on your configuration settings.

Although Gatsby is only a year old, it has garnered significant attention and adoption across various settings. For example, the home page of Airbnb’s Data Science and Engineering Blog runs on Gatsby, while the actual blog posts are hosted on Medium.

Why use Gatsby? What are the benefits of choosing Gatsby?

• Speed: The primary advantage of using Gatsby to build a static site is speed. Webmasters have been working to optimize load times since Google announced its use of site speed in web search ranking. Slow load times can also negatively impact page views and conversions, with one-second delays potentially resulting in a 7% reduction in conversions.

• Security: Static sites provide added security, as they consist of a collection of static files being served, leaving little room for hacking attempts. If the static files are lost, they can easily be regenerated.

• Server Costs: Hosting a dynamic site requires server compatibility with your technology stack. With a static site, however, you can host it on almost any server, lowering the cost of hosting.

A new image format for the Web

WebP is an advanced image format designed for web images that offers high-quality lossless and lossy compression. By using WebP, web developers and webmasters can create smaller, more detailed images that enhance web performance.

Compared to PNGs, WebP lossless images are 26% smaller in size. For lossy images, WebP images are 25-34% smaller than equivalent JPEG images with similar SSIM quality index.

WebP lossless format also supports transparency (alpha channel) at just 22% additional bytes, making it a cost-effective option. For lossy RGB compression, WebP also supports transparency, usually delivering file sizes that are 3 times smaller than PNG.

In addition, WebP supports lossy, lossless and transparency in animated images, which can help reduce file size compared to GIF and APNG.