<?xml version="1.0" encoding="utf-8"?>
<feed xmlns="http://www.w3.org/2005/Atom"><title>Peakhour.IO - Features</title><link href="https://www.peakhour.io/" rel="alternate"></link><link href="https://www.peakhour.io/feeds/features.atom.xml" rel="self"></link><id>https://www.peakhour.io/</id><updated>2023-08-03T13:00:00+10:00</updated><entry><title>Vary Cache on Cookie Value</title><link href="https://www.peakhour.io/blog/vary-cache-on-cookie-value/" rel="alternate"></link><published>2023-08-03T13:00:00+10:00</published><updated>2023-08-03T13:00:00+10:00</updated><author><name>Dan</name></author><id>tag:www.peakhour.io,2023-08-03:/blog/vary-cache-on-cookie-value/</id><summary type="html">&lt;p&gt;Varying the cache on a specific cookie value is a powerful way to cache personalised content. Many CDNs consider this an enterprise feature, but it's essential for modern dynamic websites.&lt;/p&gt;</summary><content type="html">&lt;p&gt;On most websites, a user requests a page and receives the same response as everyone else. Some websites, however, change
the content depending on who is visiting. For example, someone visiting from Australia might get the page in English,
while someone visiting from Spain gets it in Spanish.&lt;/p&gt;
&lt;h2&gt;The Vary Header&lt;/h2&gt;
&lt;p&gt;The HTTP &lt;code&gt;Vary&lt;/code&gt; header is the standard way to tell a cache that the content of a page can change depending on a request
header. For example, if a website returns this header:&lt;/p&gt;
&lt;div class="highlight"&gt;&lt;pre&gt;&lt;span&gt;&lt;/span&gt;&lt;code&gt;&lt;span class="n"&gt;Vary&lt;/span&gt;&lt;span class="o"&gt;:&lt;/span&gt;&lt;span class="w"&gt; &lt;/span&gt;&lt;span class="n"&gt;Accept&lt;/span&gt;&lt;span class="o"&gt;-&lt;/span&gt;&lt;span class="n"&gt;Language&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;

&lt;p&gt;It tells any cache that the content can change depending on the language preference of the user's browser. The cache then
stores a separate copy of the page for each language.&lt;/p&gt;
&lt;p&gt;That works for standard request headers, but content often changes based on something else. For example, a user might be
able to select their currency on an ecommerce store. This preference is usually stored in a cookie.&lt;/p&gt;
&lt;p&gt;A common, but problematic, way of handling this is to return:&lt;/p&gt;
&lt;div class="highlight"&gt;&lt;pre&gt;&lt;span&gt;&lt;/span&gt;&lt;code&gt;&lt;span class="n"&gt;Vary&lt;/span&gt;&lt;span class="o"&gt;:&lt;/span&gt;&lt;span class="w"&gt; &lt;/span&gt;&lt;span class="n"&gt;Cookie&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;

&lt;p&gt;This tells the cache to store a separate version of the page for every unique &lt;code&gt;Cookie&lt;/code&gt; header it sees. The problem is that
the &lt;code&gt;Cookie&lt;/code&gt; header can contain many different cookies (e.g., for analytics, session tracking, etc.), creating many cached
versions and a very low cache hit rate. This effectively makes caching useless.&lt;/p&gt;
&lt;h2&gt;Varying on a Specific Cookie Value&lt;/h2&gt;
&lt;p&gt;A better solution is to vary the cache based on the value of a &lt;em&gt;specific&lt;/em&gt; cookie. For example, an ecommerce store might use
a cookie named &lt;code&gt;currency&lt;/code&gt; to store the user's preference. By instructing the CDN to look only at the value of the &lt;code&gt;currency&lt;/code&gt;
cookie, it can store separate cached versions for AUD, USD, EUR, etc., while ignoring all other cookies.&lt;/p&gt;
&lt;p&gt;This means you can serve personalised, dynamic content while still benefiting from a high cache hit rate.&lt;/p&gt;
&lt;h2&gt;Use Cases&lt;/h2&gt;
&lt;p&gt;Varying the cache on a cookie value is useful for dynamic websites:&lt;/p&gt;
&lt;ol&gt;
&lt;li&gt;&lt;strong&gt;Multi-Currency/Multi-Lingual Stores&lt;/strong&gt;: Serve cached pages with the correct currency and language for each user.&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;User Groups&lt;/strong&gt;: Show different content or pricing to different user groups, like wholesale vs. retail customers, without them needing to log in.&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;A/B Testing&lt;/strong&gt;: Serve different versions of a page to different users as part of an A/B test and cache both versions.&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;Personalisation&lt;/strong&gt;: Cache pages with personalised content, like recently viewed items or location-based offers.&lt;/li&gt;
&lt;/ol&gt;
&lt;h2&gt;Enterprise or Essential?&lt;/h2&gt;
&lt;p&gt;Many major CDN providers restrict this feature to their expensive enterprise plans, putting it out of reach for many businesses.
At Peakhour, we see it as an essential feature for modern dynamic websites. That's why we make it available on all our plans.
It's a core part of our 'Enterprise for Everyone' philosophy.&lt;/p&gt;
&lt;p&gt;The ability to vary the cache on a specific cookie value addresses the limitations of the &lt;code&gt;Vary: Cookie&lt;/code&gt; header and allows
for efficient caching of personalised content. It is not a luxury feature; it is an essential tool for improving performance
and user experience on modern websites.&lt;/p&gt;</content><category term="Features"></category><category term="Caching"></category><category term="CDN"></category><category term="Drupal"></category></entry><entry><title>Content and Origin Mounting</title><link href="https://www.peakhour.io/blog/content-mounting/" rel="alternate"></link><published>2023-06-29T13:00:00+10:00</published><updated>2023-06-29T13:00:00+10:00</updated><author><name>Dan</name></author><id>tag:www.peakhour.io,2023-06-29:/blog/content-mounting/</id><summary type="html">&lt;p&gt;Content/Origin mounting allows you to seamlessly bring content together from multiple sources, on to your main website.&lt;/p&gt;</summary><content type="html">&lt;p&gt;Some features look niche until you map them to the problems they remove. Content mounting is one of those features.
It has been available in Peakhour for some time and has helped solve some unique challenges for our biggest clients.
We've applied it to SEO, usability, performance, and security problems. Peakhour's implementation is also unique in the
CDN world.&lt;/p&gt;
&lt;h2&gt;What is Content Mounting?&lt;/h2&gt;
&lt;p&gt;Peakhour's 'Content Mounting' lets you 'mount' content hosted on another website or server onto a subfolder
of your main website. For example, say you have the primary hostname of:&lt;/p&gt;
&lt;div class="highlight"&gt;&lt;pre&gt;&lt;span&gt;&lt;/span&gt;&lt;code&gt;example.com
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;

&lt;p&gt;This feature effectively means that you can serve content from:&lt;/p&gt;
&lt;div class="highlight"&gt;&lt;pre&gt;&lt;span&gt;&lt;/span&gt;&lt;code&gt;shop.example.com
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;

&lt;p&gt;under your primary hostname, eg&lt;/p&gt;
&lt;div class="highlight"&gt;&lt;pre&gt;&lt;span&gt;&lt;/span&gt;&lt;code&gt;example.com/shop/.
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;

&lt;p&gt;Fetching content from a different origin is configured using Edgerules, giving you a high degree of control over how content
is fetched and for whom. EdgeRules allow you to:&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;Match criteria beyond the URL, for example a cookie value, a header, the device type, and more.&lt;/li&gt;
&lt;li&gt;Override the hostname header, eg the incoming request for example.com will have the host header to the origin replaced
  with shop.example.com. This is crucial for the secondary origin server to respond to the request. It also overrides
  the Server Name Indication (SNI) for the request to the origin.&lt;/li&gt;
&lt;li&gt;Rewrite the path, eg the request for /shop/ can be rewritten to be just / so it matches the URL scheme on the secondary
  origin.&lt;/li&gt;
&lt;li&gt;Rewrite links in the returned HTML document. Content on shop.example.com will have resources/links referencing
  shop.example.com. Those links need to be rewritten as example.com/shop/ so navigation stays on example.com and
  CSS/JS/images load properly. The restriction is that only links in HTML will be rewritten. Links in JavaScript or CSS
  won't be rewritten, so content might not look right.&lt;/li&gt;
&lt;/ul&gt;
&lt;h2&gt;Use Cases for Content Mounting&lt;/h2&gt;
&lt;ol&gt;
&lt;li&gt;&lt;strong&gt;Boost domain authority&lt;/strong&gt;: By 'mounting' all your content onto your main domain, you can significantly increase the amount of quality content
   under your primary URL. This aggregation can improve your website's domain authority, a key factor search engines
   consider when ranking your site.&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;Improved User Experience&lt;/strong&gt;: This strategy also improves the user experience by keeping everything under one main
   domain. It reduces confusion, provides consistency, and keeps navigation seamless. Search engines prioritise websites
   that offer a strong user experience, so this could indirectly improve your rankings.&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;Improve Performance&lt;/strong&gt;: Each hostname that the browser has to connect to incurs a performance cost. It has to start
   a new thread and negotiate a DNS lookup and TLS handshake. You can speed things along with browser hints like
   dns-prefetch and pre-connect but it can still be in the region of 100-500ms per hostname. Mounting them onto your
   main domain and allowing Peakhour to maintain warm connections to the different hosts can deliver measurable benefits.&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;API Security&lt;/strong&gt;: With the rise of Headless eCommerce and microservices, it is common for information to be fetched
   from several different hostnames. By mounting them on your main domain, say under /api/, you can achieve versioning and consistency.&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;Eliminate CORS configuration issues and preflight requests&lt;/strong&gt;: When JavaScript
   in your browser has to call another hostname, it needs specific headers that grant permission,
   and there is also a preflight request penalty. Trendspek eliminated CORS and preflight requests from their
   application using our content mounting and dramatically improved 3D model loading.&lt;/li&gt;
&lt;/ol&gt;
&lt;h2&gt;Conclusion&lt;/h2&gt;
&lt;p&gt;Content mounting is a practical tool for organising and orchestrating your website content. With the rise
of microservices and headless ecommerce, it can be vital for ensuring a consistent and secure website experience.&lt;/p&gt;</content><category term="Features"></category><category term="CDN"></category></entry><entry><title>Consistent Hash with Bounded Loads</title><link href="https://www.peakhour.io/blog/bounded-load-hashing/" rel="alternate"></link><published>2023-05-15T13:00:00+10:00</published><updated>2023-05-15T13:00:00+10:00</updated><author><name>AC</name></author><id>tag:www.peakhour.io,2023-05-15:/blog/bounded-load-hashing/</id><summary type="html">&lt;p&gt;An overview of consistent hashing with bounded loads, an advanced load balancing technique that ensures a more even distribution of keys across servers, preventing overload and improving system stability.&lt;/p&gt;</summary><content type="html">&lt;p&gt;A consistent hash with load bounds extends the basic consistent hashing technique. Standard consistent hashing
distributes keys across servers in a way that minimises rehashing when servers are added or removed, but it does not
guarantee a perfectly even load distribution. Random hash collisions can leave some servers responsible for
significantly more keys than others, creating an imbalance in the load distribution.&lt;/p&gt;
&lt;p&gt;Consistent hashing with bounded loads, or bounded-load hashing, addresses this issue. It keeps the load (i.e., the
number of keys assigned) on any given server within a factor of the average load across all servers.&lt;/p&gt;
&lt;p&gt;The approach still uses a hash ring, but with an additional constraint that no server can exceed a certain load limit.
When a key is hashed and the corresponding server in the hash ring is already at its load limit, the key is assigned to
the next server in the hash ring that isn't at its load limit. This process is repeated until all keys have been
assigned.&lt;/p&gt;
&lt;p&gt;Here's a rough pseudocode example:&lt;/p&gt;
&lt;div class="highlight"&gt;&lt;pre&gt;&lt;span&gt;&lt;/span&gt;&lt;code&gt;&lt;span class="c1"&gt;# Function to add a key with bounded loads&lt;/span&gt;
&lt;span class="k"&gt;def&lt;/span&gt; &lt;span class="nf"&gt;add_key_bounded&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="n"&gt;key&lt;/span&gt;&lt;span class="p"&gt;):&lt;/span&gt;
    &lt;span class="n"&gt;position&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="n"&gt;hash_function&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="n"&gt;key&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;

    &lt;span class="c1"&gt;# Find the server for this key&lt;/span&gt;
    &lt;span class="k"&gt;for&lt;/span&gt; &lt;span class="n"&gt;i&lt;/span&gt; &lt;span class="ow"&gt;in&lt;/span&gt; &lt;span class="nb"&gt;range&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="n"&gt;position&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="n"&gt;position&lt;/span&gt;&lt;span class="o"&gt;+&lt;/span&gt;&lt;span class="mi"&gt;1000&lt;/span&gt;&lt;span class="p"&gt;):&lt;/span&gt;
        &lt;span class="n"&gt;i&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="n"&gt;i&lt;/span&gt; &lt;span class="o"&gt;%&lt;/span&gt; &lt;span class="mi"&gt;1000&lt;/span&gt;  &lt;span class="c1"&gt;# To loop back to the beginning of the ring&lt;/span&gt;
        &lt;span class="k"&gt;if&lt;/span&gt; &lt;span class="n"&gt;hash_ring&lt;/span&gt;&lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="n"&gt;i&lt;/span&gt;&lt;span class="p"&gt;]&lt;/span&gt; &lt;span class="ow"&gt;is&lt;/span&gt; &lt;span class="ow"&gt;not&lt;/span&gt; &lt;span class="kc"&gt;None&lt;/span&gt; &lt;span class="ow"&gt;and&lt;/span&gt; &lt;span class="n"&gt;server_loads&lt;/span&gt;&lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="n"&gt;hash_ring&lt;/span&gt;&lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="n"&gt;i&lt;/span&gt;&lt;span class="p"&gt;]]&lt;/span&gt; &lt;span class="o"&gt;&amp;lt;&lt;/span&gt; &lt;span class="n"&gt;LOAD_LIMIT&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt;
            &lt;span class="n"&gt;server_loads&lt;/span&gt;&lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="n"&gt;hash_ring&lt;/span&gt;&lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="n"&gt;i&lt;/span&gt;&lt;span class="p"&gt;]]&lt;/span&gt; &lt;span class="o"&gt;+=&lt;/span&gt; &lt;span class="mi"&gt;1&lt;/span&gt;  &lt;span class="c1"&gt;# Increment the server&amp;#39;s load&lt;/span&gt;
            &lt;span class="k"&gt;return&lt;/span&gt; &lt;span class="n"&gt;hash_ring&lt;/span&gt;&lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="n"&gt;i&lt;/span&gt;&lt;span class="p"&gt;]&lt;/span&gt;  &lt;span class="c1"&gt;# Return the server that should handle this key&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;

&lt;p&gt;In this example, &lt;code&gt;server_loads&lt;/code&gt; is a dictionary that tracks how many keys each server is responsible for,
and &lt;code&gt;LOAD_LIMIT&lt;/code&gt; is the maximum number of keys any server is allowed to handle.&lt;/p&gt;
&lt;p&gt;By bounding the load on each server, this approach can produce a more balanced distribution of keys across servers.
However, it's worth noting that this algorithm can result in keys being assigned to servers that are not their nearest
neighbours in the hash ring, which can increase latency in some cases. As with any algorithm, there's a
trade-off between &lt;a href="/learning/load-balancing/"&gt;load balancing&lt;/a&gt; and other factors such as latency and computational overhead.&lt;/p&gt;
&lt;p&gt;The Google Cloud team, in collaboration with visiting researcher Mikkel Thorup from the University of Copenhagen,
devised an efficient allocation algorithm to improve load balancing in large-scale web services such as content hosting.
The results of their research were detailed in a paper titled “Consistent Hashing with Bounded Loads” that was published
in August 2016.&lt;/p&gt;
&lt;p&gt;Load balancing in large-scale web services means distributing client requests evenly across multiple servers to prevent
any individual server from becoming overloaded. An ideal load-balancing system distributes the load uniformly and
minimises the changes to the system when servers or clients are added or removed. This consistency matters in dynamic
environments where servers and clients can change over time.&lt;/p&gt;
&lt;p&gt;Traditional consistent hashing techniques, although effective for load balancing in dynamic environments, can still lead
to sub-optimal load distribution across servers in certain scenarios. As both servers and clients can be added or
removed frequently, the load balancing algorithm needs to stay dynamic and adaptive, maintaining an evenly distributed
load while minimising the number of client reassignments whenever a change occurs.&lt;/p&gt;
&lt;p&gt;Google's algorithm addresses these challenges. To explain their method, they use an analogy of servers as bins and
clients as balls. The goal is for all bins (servers) to have a load (clients) roughly equal to the average density, with
a small tolerance factor, ε. The algorithm is designed to ensure that every bin has a capacity within the range of the
average load times (1+ε), which helps achieve both uniformity and consistency in client-server allocations.&lt;/p&gt;
&lt;p&gt;The algorithm employs two separate hash functions to assign positions to balls (clients) and bins (servers) on a
circular continuum. The balls are then allocated in a specific order (say, based on their ID), with each ball being
assigned to the first bin it encounters with spare capacity as it moves clockwise on the circle.&lt;/p&gt;
&lt;p&gt;The algorithm recomputes the allocation whenever an update occurs (i.e., the addition or removal of a client or server)
to maintain the uniform distribution of load. The paper proves that every ball removal or insertion in the system
results in O(1/ε²) movements of other balls. Importantly, this upper bound is independent of the total number of balls
or bins in the system, which means the algorithm scales well with increasing size.&lt;/p&gt;
&lt;p&gt;The algorithm creates a trade-off between uniformity and consistency. A smaller ε value provides better uniformity but
compromises consistency, while a larger ε value improves consistency but reduces uniformity. The algorithm performs well
even in worst-case scenarios, making it ideal for dynamic, large-scale environments like content hosting services.&lt;/p&gt;
&lt;p&gt;Google's algorithm has been used in production. Andrew Rodland from Vimeo implemented it in HAProxy, a popular
open-source software package, for their load balancing project, resulting in a substantial decrease in cache bandwidth
by almost a factor of 8. This eliminated a significant scaling bottleneck, showing the algorithm's practical
effectiveness.&lt;/p&gt;
&lt;p&gt;Overall, the work of the Google Cloud team and Mikkel Thorup is a useful contribution to load balancing. By addressing
the challenges of uniformity and consistency in dynamic environments, their algorithm provides a robust solution for
managing large-scale web services efficiently. The team's research and its open-source availability give the broader
community a practical implementation path.&lt;/p&gt;</content><category term="Features"></category><category term="Rate Limiting"></category><category term="Drupal"></category></entry><entry><title>Locality Sensitive Hashing</title><link href="https://www.peakhour.io/blog/lsh-maglev/" rel="alternate"></link><published>2023-05-15T13:00:00+10:00</published><updated>2023-05-15T13:00:00+10:00</updated><author><name>AC</name></author><id>tag:www.peakhour.io,2023-05-15:/blog/lsh-maglev/</id><summary type="html">&lt;p&gt;An introduction to Locality Sensitive Hashing (LSH) and its application in load balancing, including consistent hashing and its use in CDNs and Google's Maglev for efficient server pool management.&lt;/p&gt;</summary><content type="html">&lt;p&gt;Locality Sensitive Hashing (LSH) is a computer science technique for designing hash functions for high-dimensional data.
LSH aims to maximise the probability that similar items map to the same hash bucket. The principle is to amplify the
difference between similar and dissimilar items, keeping similar items closer together while pushing dissimilar items
farther apart. This gives a probabilistic approach to nearest neighbour search, a problem that appears in machine
learning, data mining, and information retrieval.&lt;/p&gt;
&lt;h2&gt;Background and Usage of LSH&lt;/h2&gt;
&lt;p&gt;LSH was introduced by Piotr Indyk and Rajeev Motwani in 1998 to address the "curse of dimensionality," where traditional
computational algorithms become significantly less efficient as the dimensionality of a problem increases. This makes
LSH useful in contexts dealing with large and complex data sets, including text analysis, recommendation systems, image
recognition, and genome sequencing.&lt;/p&gt;
&lt;p&gt;The general idea is to use hashing to map high-dimensional data into a lower-dimensional hash space. The hashing scheme
is designed so that collisions are much more likely for objects close to each other in the original space than for
objects far apart. This supports sub-linear time complexity for nearest neighbour searches, which matters when working
with large data sets.&lt;/p&gt;
&lt;h2&gt;LSH Variant for Load Balancing&lt;/h2&gt;
&lt;p&gt;LSH is also used in load balancing for distributed systems. A variant of LSH, known as Consistent Hashing, is often used
for this purpose. In consistent hashing, the output range of a hash function is treated as a fixed circular space or
"ring" (think of this as a circular hash table). Each node or server in the system is assigned a random value within
this space, and each data item or request is assigned to the node closest to it in the hash space.&lt;/p&gt;
&lt;p&gt;The practical advantage of consistent hashing is that when a node is added or removed, only an average of 1/n keys need
to be remapped, where n is the number of servers. Conventional hash functions would require almost all keys to be
remapped. This property makes consistent hashing useful in dynamic environments where the server set changes often, such
as in a CDN (&lt;a href="/learning/cdn/"&gt;Content Delivery Network&lt;/a&gt;).&lt;/p&gt;
&lt;h2&gt;LSH in CDNs for Load Splitting and Caching&lt;/h2&gt;
&lt;p&gt;In a CDN, data is distributed across multiple servers in different geographical regions. The objective is to let users
access the data they need as quickly as possible. This is achieved by routing each user's request to the server closest
to them that has the data they want.&lt;/p&gt;
&lt;p&gt;Consistent hashing, a variant of LSH, fits this scenario. By hashing both data and user requests, we can assign each
request to the server closest in the hash space. This approach gives an even distribution of load across all servers,
improving overall system performance.&lt;/p&gt;
&lt;p&gt;LSH can also make CDN caching more efficient. When a request for a specific piece of content comes in, the CDN can use
the hash function to find the server holding that content. The content can then be served quickly, improving the user
experience.&lt;/p&gt;
&lt;h2&gt;LSH and Server Pool Rebalancing&lt;/h2&gt;
&lt;p&gt;LSH also helps with rebalancing server pools. In dynamic environments, workload changes constantly, and servers may be
added or removed frequently. This can create an imbalance in load distribution across servers.&lt;/p&gt;
&lt;p&gt;Consistent hashing mitigates this issue. As mentioned earlier, when a server is added or removed, consistent hashing
only requires a minimal reassignment of keys. This keeps load redistribution to a minimum, so the system can quickly
adapt while maintaining a balanced load across all servers.&lt;/p&gt;
&lt;h2&gt;Maglev and LSH&lt;/h2&gt;
&lt;p&gt;Maglev is a network load balancer developed by Google that uses a distinctive approach to connection distribution. It
employs a variant of consistent hashing to balance load across a pool of servers. Using a large lookup table and a
consistent hashing-like algorithm, Maglev can evenly distribute traffic across servers, even when servers are added or
removed.&lt;/p&gt;
&lt;p&gt;Maglev's algorithm starts by assigning a pseudorandom permutation of backend servers for each entry in the lookup table.
These entries are then filled by iterating over the permutation and assigning each entry to a server. If a server
becomes unavailable, its entries are reassigned to other servers using the same permutation. If a server becomes
available, it is gradually reintroduced into the permutation, minimising disruption. This is a practical demonstration
of LSH's principles applied to server load, high availability, and performance.&lt;/p&gt;
&lt;h2&gt;Conclusion&lt;/h2&gt;
&lt;p&gt;Locality Sensitive Hashing has applications from high-dimensional data analysis to load balancing in distributed
systems. Its property of bringing similar items closer in the hash space and pushing dissimilar items farther apart
makes it useful for handling large and complex datasets. In CDNs and server pool management, LSH, and its variant
Consistent Hashing, support balanced load distribution and efficient caching, improving system performance and user
experience. Its application in Google's Maglev shows how these principles can be used in production-scale load
balancing.&lt;/p&gt;</content><category term="Features"></category><category term="SEO"></category></entry><entry><title>Multi-Origin Load Balancing</title><link href="https://www.peakhour.io/blog/multi-origin-load-balancing/" rel="alternate"></link><published>2023-04-11T13:00:00+10:00</published><updated>2023-04-11T13:00:00+10:00</updated><author><name>Dan</name></author><id>tag:www.peakhour.io,2023-04-11:/blog/multi-origin-load-balancing/</id><summary type="html">&lt;p&gt;Websites with a global audience need more than just a traditional CDN. They need geographic multi origin load balancing.&lt;/p&gt;</summary><content type="html">&lt;p&gt;Websites and applications with global audiences often run into a problem that a standard CDN cannot always hide: not
every request can be served from cache. Traditional Content Delivery Networks (CDNs) reduce latency by distributing
content across multiple points of presence (POPs) around the world. But when content has to be fetched from a distant
origin server, for example dynamic content that cannot be cached, users still wait on that round trip. This post explains
the problem multi-origin &lt;a href="/learning/load-balancing/"&gt;load balancing&lt;/a&gt; solves and how Peakhour handles it.&lt;/p&gt;
&lt;h2&gt;Understanding the Problem&lt;/h2&gt;
&lt;p&gt;Web content usually starts from a single server, called the origin server. As a website's audience grows, that server
takes more traffic, which can slow response times. CDNs reduce the pressure by caching and delivering content from
servers distributed across multiple geographic locations. When the content is already cached, this reduces origin load
and lowers latency for users accessing the content.&lt;/p&gt;
&lt;p&gt;However, traditional CDNs still have limits when serving global audiences. If a user requests content that is not cached
in the CDN, the request has to go back to the origin server. If that origin is far away from the user, latency increases
and pages take longer to load.&lt;/p&gt;
&lt;p&gt;Multi-origin load balancing addresses that remaining gap in &lt;a href="/learning/cdn/"&gt;CDN&lt;/a&gt; performance and further reduces latency.&lt;/p&gt;
&lt;h2&gt;Introducing Multi-Origin Load Balancing&lt;/h2&gt;
&lt;p&gt;Traditional load balancing distributes traffic evenly across two or more servers that
are physically hosted in the same location.&lt;/p&gt;
&lt;p&gt;Multi-origin load balancing extends that approach across origin servers in different geographical locations. The
Peakhour EDGE can select the closest origin server to a user, or choose a different origin based on criteria such as
device type, user preferences, or URL. For requests not stored in the CDN, this reduces the time spent crossing long
network paths.&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;Real-Time Performance Monitoring:&lt;/strong&gt; Peakhour continuously monitors its global network of servers in real time. This
allows the system to detect potential issues or bottlenecks and adjust routing. If one origin server experiences high
traffic or goes offline, Peakhour can reroute user requests to the next best server to keep the site responsive.&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;Adaptive Content Caching:&lt;/strong&gt; Peakhour Edge uses adaptive content caching strategies, which dynamically cache both
static and dynamic content based on user behaviour and request patterns. Frequently requested dynamic elements, such as
personalised user data or search results, are cached on edge servers, reducing the need to fetch content from the
origin servers and further minimising latency.&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;Load Balancing and Failover:&lt;/strong&gt; Peakhour's multi-origin load balancing is complemented by load balancing and failover
mechanisms. These features keep the system resilient and responsive during periods of high traffic or server outages.
By distributing user requests evenly across origin servers and automatically redirecting traffic when a server fails,
Peakhour maintains a stable and reliable content delivery experience for users worldwide.&lt;/p&gt;
&lt;h2&gt;Conclusion&lt;/h2&gt;
&lt;p&gt;Multi-origin load balancing addresses the limitations of traditional CDNs by optimising content delivery for a global
audience. Peakhour Edge reduces latency and improves the experience for users who would otherwise wait on a distant
origin server.&lt;/p&gt;
&lt;p&gt;As web content and applications grow in complexity and reach, origin placement and routing become part of performance
planning. Peakhour implements multi-origin load balancing with clients' origin servers so requests can be sent to the
most suitable origin instead of treating a single distant server as the only fallback.&lt;/p&gt;</content><category term="Features"></category><category term="CDN"></category><category term="Web Performance"></category><category term="Drupal"></category><category term="Caching"></category><category term="Rate Limiting"></category></entry><entry><title>The Death of JPEG-XL</title><link href="https://www.peakhour.io/blog/the-death-of-jxl/" rel="alternate"></link><published>2023-04-05T13:00:00+10:00</published><updated>2023-04-05T13:00:00+10:00</updated><author><name>AC</name></author><id>tag:www.peakhour.io,2023-04-05:/blog/the-death-of-jxl/</id><summary type="html">&lt;p&gt;We bid farewell to JPEG-XL after its abrupt deprecation by Google, reinforcing the tech giant's domineering influence over the web and sparking a call for resilient alternatives.&lt;/p&gt;</summary><content type="html">&lt;p&gt;Today, Peakhour disabled JPEG-XL transformations on our image optimisation service. We had enabled them because the technical case
looked strong, but that work came to an abrupt stop when Google announced it was deprecating JPEG-XL in Chrome.&lt;/p&gt;
&lt;p&gt;JPEG-XL (JXL) was widely treated as a serious next-generation image format. It was royalty-free, performed better than
JPEG, and had only recently become practical to target, with the bitstream frozen in late 2020. Google then removed
support for the young format in Chrome 110, a decision that mattered because of Chrome's reach.&lt;/p&gt;
&lt;h2&gt;The Rise and Fall of JXL&lt;/h2&gt;
&lt;p&gt;The decision to phase out JXL was hard to reconcile with the state of the format. As an image optimisation service focused on transparent image
optimisation, we had been following JXL closely and had seen substantial improvements and interest. Seeing it shelved
so soon was frustrating, especially since it was largely based on Google's own PIK proposal.&lt;/p&gt;
&lt;p&gt;The rationale provided by Google was that there wasn't "enough interest from the entire ecosystem" and the format did
not bring "sufficient incremental benefits." That justification was thin. JXL was still experimental, so broad adoption
was always going to take time. Google also did not provide direct comparisons with existing formats that proved JXL
lacked incremental benefits.&lt;/p&gt;
&lt;p&gt;Google's move shows how much control Chrome gives it over web standards, with other browsers often left to follow.
That matters. By deciding what features are included or omitted in Chrome, Google shapes the web, often in line with
its own strategic interests. The deprecation of JXL in favour of its own patented AVIF format is one example.&lt;/p&gt;
&lt;h2&gt;A Resounding Response From the Community&lt;/h2&gt;
&lt;p&gt;The community response was unusually strong. The issue surrounding JXL's removal became the second most "starred" issue
in the history of the Chromium project. Developers raised clear concerns about Google disregarding community feedback
while exercising heavy influence over web standards. Google's interpretation of "ecosystem interest" may be more
self-referential than it appears.&lt;/p&gt;
&lt;p&gt;This incident, like many before it, shows the control Google exercises over the web and the impact of its decisions on
the internet ecosystem. Our removal of JXL transformations from Peakhour's services is a reluctant acceptance of that
reality.&lt;/p&gt;
&lt;h2&gt;The Way Forward&lt;/h2&gt;
&lt;p&gt;Google's decision may have sounded the death knell for JXL, but it does not end work on better image formats. We remain
committed to optimising the digital experience for our customers and will continue to support formats that improve
performance and user experience.&lt;/p&gt;
&lt;p&gt;This incident also shows why alternatives matter when one vendor has outsized influence. Browsers like GNU IceCat,
which plan to support JXL and similar formats, keep pressure on the dominant path, and networks beyond the web like
Gemini remind us that the web is not a monopoly.&lt;/p&gt;
&lt;p&gt;This is our message to the "big G": we might be smaller, but we won't be bossed around. The internet is broad enough
for more than one path.&lt;/p&gt;</content><category term="Features"></category><category term="CDN"></category></entry><entry><title>Automatic Image Optimisation</title><link href="https://www.peakhour.io/blog/automatic-image-optimisation/" rel="alternate"></link><published>2022-12-06T13:00:00+11:00</published><updated>2022-12-06T13:00:00+11:00</updated><author><name>AC</name></author><id>tag:www.peakhour.io,2022-12-06:/blog/automatic-image-optimisation/</id><summary type="html">&lt;p&gt;Image optimisation saves you bandwidth and designer effort while reduces page load time.&lt;/p&gt;</summary><content type="html">&lt;p&gt;Since releasing our &lt;a href="/image-optimisation/"&gt;automatic image optimisation&lt;/a&gt; capability in 2019, Peakhour optimises
more than 35 million images each month. On average, clients reduce page download time by 35% and image sizes by
91%.&lt;/p&gt;
&lt;p&gt;Automatic image optimisation offers a number of benefits over manual optimisation:&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;Image formats are dynamically chosen based on the content of the image.&lt;/li&gt;
&lt;li&gt;Files are optimised based on client capabilities.&lt;/li&gt;
&lt;li&gt;Designer time is saved by offloading image optimisation work.&lt;/li&gt;
&lt;li&gt;Page load times can be reduced across an entire website.&lt;/li&gt;
&lt;/ul&gt;
&lt;h2&gt;What is Image Optimisation?&lt;/h2&gt;
&lt;p&gt;Image optimisation means delivering high quality images in the right format and resolution for the device viewing them.
The aim is to minimise file size without compromising visual quality. Smaller image files generally load faster in a
visitor's browser, which can improve website speed, reduce traffic and support higher page visits and conversions.&lt;/p&gt;
&lt;h2&gt;Why dynamically choose the image format?&lt;/h2&gt;
&lt;p&gt;Using a one size fits all optimisation process does not account for the different types of images used across a typical
website.&lt;/p&gt;
&lt;p&gt;Website images can include:&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;Photographs, such as product images, demonstration photos and title photos.&lt;/li&gt;
&lt;li&gt;Logos, which are typically text and can include animation.&lt;/li&gt;
&lt;li&gt;Illustrations that incorporate custom graphics to support the quick perception of information.&lt;/li&gt;
&lt;li&gt;3D graphics from computer renders including buildings, interior and exterior designs and products.&lt;/li&gt;
&lt;li&gt;Combinations of the above!&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;Any optimisation process needs to account for the end user's device type, supported file formats, resolution and the
content of the image. For example, a photograph with text needs different optimisation parameters so the text remains
crisp, while images with large areas of colour may need different formats to avoid colours being degraded by lossy
compression.&lt;/p&gt;
&lt;h2&gt;Fine developer control&lt;/h2&gt;
&lt;p&gt;With the &lt;a href="/docs/explanation/image-optimisation/api/"&gt;image optimisation API&lt;/a&gt;, your developers can enable reactive images by
resizing images on the edge. Peakhour serves and caches these optimisations, reducing origin requests and traffic,
cutting costs and making image changes faster to ship. You no longer need to wait for a designer to resize, crop or
re-orient an image for a page.&lt;/p&gt;
&lt;h2&gt;How does image optimisation effect web application performance&lt;/h2&gt;
&lt;p&gt;Large portions of a website are typically built from images. Large images loading over a 4G network in a train can delay
image rendering and create a poor user experience. Layout shifts can occur as the browser attempts to render the page,
and the user's perceived page load time will be affected.&lt;/p&gt;
&lt;p&gt;You can see the benefit of automatic image optimisation with our &lt;a href="/pages/page-weight"&gt;free tool&lt;/a&gt;. It will analyse any
website, calculate its optimisation potential and let you download the optimised images.&lt;/p&gt;
&lt;h2&gt;See how it can help in a real life example below&lt;/h2&gt;
&lt;div class=images&gt;
&lt;div class=image-container style="border: 1px;border-color: lightgrey; border-style: solid;"&gt;&lt;div class="section text-center"&gt;&lt;div class=image-header&gt;&lt;i class="fa-image fas" style="padding-right: 5px;"&gt;&lt;/i&gt; security.png &lt;/div&gt; &lt;div class=image-box&gt;&lt;a href=https://www.peakhour.io/static/images/security.png target=original title="show original"&gt;&lt;img src="data:image/png;base64,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" style="max-width: 100%; max-height: 300px"&gt;&lt;/a&gt;&lt;/div&gt; &lt;div class=info-box&gt;&lt;div&gt;&lt;div style="width: 40%;display: inline-block"&gt;&lt;h5&gt;Original&lt;/h5&gt;&lt;/div&gt; &lt;div style="width: 50%;display: inline-block"&gt;&lt;strong&gt;2362 x 1266px&lt;/strong&gt;&lt;/div&gt;&lt;/div&gt; &lt;div&gt;&lt;div style=" width: 35%; display: inline-block"&gt;&lt;strong&gt;PNG&lt;/strong&gt;&lt;/div&gt; &lt;div style=" width: 5%;display:inline-block"&gt;&lt;/div&gt; &lt;div style="display: inline-block; width: 25%"&gt;&lt;strong&gt;190.2 kb&lt;/strong&gt;&lt;/div&gt; &lt;div style="width: 30%; display: inline-block; font-size: 17px"&gt;&lt;span class="fa-info-circle fas text-primary" data-content="                    &lt;strong&gt;format:&lt;/strong&gt; PNG&lt;br&gt;                    &lt;strong&gt;is_animated:&lt;/strong&gt; False&lt;br&gt;                    &lt;strong&gt;colour_space:&lt;/strong&gt; RGBA&lt;br&gt;                    &lt;strong&gt;has_transparency:&lt;/strong&gt; False&lt;br&gt;                    &lt;strong&gt;is_photo:&lt;/strong&gt; True&lt;br&gt;                    &lt;strong&gt;width:&lt;/strong&gt; 2362&lt;br&gt;                    &lt;strong&gt;height:&lt;/strong&gt; 1266&lt;br&gt;            " data-title="Image Info" data-toggle=popover&gt;&lt;/span&gt;&amp;nbsp; &lt;a href=https://www.peakhour.io/static/images/security.png target=original title="open original in new window"&gt;&lt;span class="fa-external-link-alt fas text-primary"&gt;&lt;/span&gt;&lt;/a&gt;&amp;nbsp; &lt;/div&gt;&lt;/div&gt;&lt;/div&gt; &lt;div class=info-box&gt;&lt;div&gt;&lt;div style="width: 40%;display: inline-block"&gt;&lt;h5&gt;Optimised&lt;/h5&gt;&lt;/div&gt; &lt;div style="width: 50%;display: inline-block"&gt;&lt;strong&gt;605 x 324px&lt;/strong&gt;&lt;/div&gt;&lt;/div&gt; &lt;div&gt;&lt;div style="width: 35%; display: inline-block; text-transform: uppercase"&gt; png &lt;/div&gt; &lt;div style="width: 5%; display: inline-block"&gt;&lt;br&gt;&lt;/div&gt; &lt;div style="width: 25%; display: inline-block"&gt; 10.8 kb &lt;/div&gt; &lt;div style="width: 30%; display: inline-block;font-size: 17px"&gt;&lt;span class="fa-info-circle fas text-primary" data-content="                    &lt;strong&gt;format:&lt;/strong&gt; PNG&lt;br&gt;                    &lt;strong&gt;optimize:&lt;/strong&gt; True&lt;br&gt;                    &lt;strong&gt;quality:&lt;/strong&gt; 75&lt;br&gt;                    &lt;strong&gt;colour_space:&lt;/strong&gt; RGBA&lt;br&gt;                    &lt;strong&gt;lossless:&lt;/strong&gt; False&lt;br&gt;                    &lt;strong&gt;subsampling:&lt;/strong&gt; None&lt;br&gt;                    &lt;strong&gt;delay_format:&lt;/strong&gt; None&lt;br&gt;                    &lt;strong&gt;strip:&lt;/strong&gt; True&lt;br&gt;                    &lt;strong&gt;compression:&lt;/strong&gt; 6&lt;br&gt;            " data-title="Optimised Info" data-toggle=popover&gt;&lt;/span&gt;&amp;nbsp; &lt;a download=security.png.optimised.png href=/page-weight/result/41377868-5104-4eaf-9776-a9a682a5e8f5/images/6641ec77-2367-4c17-ab27-2447cdc8aceb/img.png title=download&gt;&lt;span class="fa-download fas text-primary"&gt;&lt;/span&gt;&lt;/a&gt;&amp;nbsp; &lt;a href=/page-weight/result/41377868-5104-4eaf-9776-a9a682a5e8f5/images/6641ec77-2367-4c17-ab27-2447cdc8aceb/img.png target=6641ec77-2367-4c17-ab27-2447cdc8aceb title="Open in new window"&gt;&lt;span class="fa-external-link-alt fas text-primary"&gt;&lt;/span&gt;&lt;/a&gt;&lt;/div&gt;&lt;/div&gt; &lt;div&gt;&lt;div style="width: 35%; display: inline-block; text-transform: uppercase"&gt; jpeg &lt;/div&gt; &lt;div style="width: 5%; display: inline-block"&gt;&lt;br&gt;&lt;/div&gt; &lt;div style="width: 25%; display: inline-block"&gt; 15.4 kb &lt;/div&gt; &lt;div style="width: 30%; display: inline-block;font-size: 17px"&gt;&lt;span class="fa-info-circle fas text-primary" data-content="                    &lt;strong&gt;format:&lt;/strong&gt; JPEG&lt;br&gt;                    &lt;strong&gt;optimize:&lt;/strong&gt; True&lt;br&gt;                    &lt;strong&gt;quality:&lt;/strong&gt; 75&lt;br&gt;                    &lt;strong&gt;colour_space:&lt;/strong&gt; RGB&lt;br&gt;                    &lt;strong&gt;lossless:&lt;/strong&gt; False&lt;br&gt;                    &lt;strong&gt;subsampling:&lt;/strong&gt; 4:2:0&lt;br&gt;                    &lt;strong&gt;delay_format:&lt;/strong&gt; None&lt;br&gt;                    &lt;strong&gt;strip:&lt;/strong&gt; True&lt;br&gt;                    &lt;strong&gt;progressive:&lt;/strong&gt; False&lt;br&gt;                    &lt;strong&gt;progressive_min_bytes:&lt;/strong&gt; 10240&lt;br&gt;                    &lt;strong&gt;quant_table:&lt;/strong&gt; 3&lt;br&gt;            " data-title="Optimised Info" data-toggle=popover&gt;&lt;/span&gt;&amp;nbsp; &lt;a download=security.png.optimised.jpeg href=/page-weight/result/41377868-5104-4eaf-9776-a9a682a5e8f5/images/796c932f-a4a1-4a4b-890d-d88fba459c29/img.jpeg title=download&gt;&lt;span class="fa-download fas text-primary"&gt;&lt;/span&gt;&lt;/a&gt;&amp;nbsp; &lt;a href=/page-weight/result/41377868-5104-4eaf-9776-a9a682a5e8f5/images/796c932f-a4a1-4a4b-890d-d88fba459c29/img.jpeg target=796c932f-a4a1-4a4b-890d-d88fba459c29 title="Open in new window"&gt;&lt;span class="fa-external-link-alt fas text-primary"&gt;&lt;/span&gt;&lt;/a&gt;&lt;/div&gt;&lt;/div&gt; &lt;div&gt;&lt;div style="width: 35%; display: inline-block; text-transform: uppercase"&gt; [webp](/products/image-optimisation-and-transformation/) &lt;/div&gt; &lt;div style="width: 5%; display: inline-block"&gt;&lt;br&gt;&lt;/div&gt; &lt;div style="width: 25%; display: inline-block"&gt; 10.7 kb &lt;/div&gt; &lt;div style="width: 30%; display: inline-block;font-size: 17px"&gt;&lt;span class="fa-info-circle fas text-primary" data-content="                    &lt;strong&gt;save_all:&lt;/strong&gt; False&lt;br&gt;                    &lt;strong&gt;duration:&lt;/strong&gt; None&lt;br&gt;                    &lt;strong&gt;loop:&lt;/strong&gt; None&lt;br&gt;                    &lt;strong&gt;format:&lt;/strong&gt; WEBP&lt;br&gt;                    &lt;strong&gt;optimize:&lt;/strong&gt; False&lt;br&gt;                    &lt;strong&gt;quality:&lt;/strong&gt; 75&lt;br&gt;                    &lt;strong&gt;colour_space:&lt;/strong&gt; None&lt;br&gt;                    &lt;strong&gt;lossless:&lt;/strong&gt; False&lt;br&gt;                    &lt;strong&gt;subsampling:&lt;/strong&gt; None&lt;br&gt;                    &lt;strong&gt;delay_format:&lt;/strong&gt; None&lt;br&gt;                    &lt;strong&gt;strip:&lt;/strong&gt; True&lt;br&gt;                    &lt;strong&gt;method:&lt;/strong&gt; 3&lt;br&gt;                    &lt;strong&gt;kmin:&lt;/strong&gt; None&lt;br&gt;                    &lt;strong&gt;kmax:&lt;/strong&gt; None&lt;br&gt;                    &lt;strong&gt;allow_mixed:&lt;/strong&gt; False&lt;br&gt;                    &lt;strong&gt;minimize_size:&lt;/strong&gt; True&lt;br&gt;            " data-title="Optimised Info" data-toggle=popover&gt;&lt;/span&gt;&amp;nbsp; &lt;a download=security.png.optimised.webp href=/page-weight/result/41377868-5104-4eaf-9776-a9a682a5e8f5/images/72346c2d-1302-40f0-bb38-027890c5c920/img.webp title=download&gt;&lt;span class="fa-download fas text-primary"&gt;&lt;/span&gt;&lt;/a&gt;&amp;nbsp; &lt;a href=/page-weight/result/41377868-5104-4eaf-9776-a9a682a5e8f5/images/72346c2d-1302-40f0-bb38-027890c5c920/img.webp target=72346c2d-1302-40f0-bb38-027890c5c920 title="Open in new window"&gt;&lt;span class="fa-external-link-alt fas text-primary"&gt;&lt;/span&gt;&lt;/a&gt;&lt;/div&gt;&lt;/div&gt; &lt;div&gt;&lt;div style="width: 35%;display: inline-block; text-transform: uppercase"&gt;&lt;strong&gt;avif &lt;span class="fa-trophy fas text-primary"&gt;&lt;/span&gt;&lt;/strong&gt;&lt;/div&gt; &lt;div style="width: 5%; display: inline-block"&gt;&lt;br&gt;&lt;/div&gt; &lt;div style="width: 25%; display: inline-block"&gt;&lt;strong&gt;8.2 kb&lt;/strong&gt;&lt;/div&gt; &lt;div style="width: 30%; display: inline-block;font-size: 17px"&gt;&lt;span class="fa-info-circle fas text-primary" data-content="                    &lt;strong&gt;format:&lt;/strong&gt; AVIF&lt;br&gt;                    &lt;strong&gt;optimize:&lt;/strong&gt; True&lt;br&gt;                    &lt;strong&gt;quality:&lt;/strong&gt; 50&lt;br&gt;                    &lt;strong&gt;colour_space:&lt;/strong&gt; RGBA&lt;br&gt;                    &lt;strong&gt;lossless:&lt;/strong&gt; False&lt;br&gt;                    &lt;strong&gt;subsampling:&lt;/strong&gt; None&lt;br&gt;                    &lt;strong&gt;delay_format:&lt;/strong&gt; None&lt;br&gt;                    &lt;strong&gt;strip:&lt;/strong&gt; True&lt;br&gt;                    &lt;strong&gt;compression:&lt;/strong&gt; 6&lt;br&gt;            " data-title="Optimised Info" data-toggle=popover&gt;&lt;/span&gt;&amp;nbsp; &lt;a download=security.png.optimised.avif href=/page-weight/result/41377868-5104-4eaf-9776-a9a682a5e8f5/images/11a20ace-cd35-4f59-91f7-2794c8650815/img.avif title=download&gt;&lt;span class="fa-download fas text-primary"&gt;&lt;/span&gt;&lt;/a&gt;&amp;nbsp; &lt;a href=/page-weight/result/41377868-5104-4eaf-9776-a9a682a5e8f5/images/11a20ace-cd35-4f59-91f7-2794c8650815/img.avif target=11a20ace-cd35-4f59-91f7-2794c8650815 title="Open in new window"&gt;&lt;span class="fa-external-link-alt fas text-primary"&gt;&lt;/span&gt;&lt;/a&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;
&lt;/div&gt;

&lt;h2&gt;Benefits of Peakhour Automatic Image Optimisation&lt;/h2&gt;
&lt;p&gt;Peakhour image optimisation is integrated into your website so you can reduce traffic, speed up page loads and remove
manual image preparation from the design workflow.&lt;/p&gt;
&lt;ol&gt;
&lt;li&gt;Transforming images on the Peakhour edge enables agility and offloads origin work.&lt;/li&gt;
&lt;li&gt;User experience is improved through faster-loading pages, without a separate workflow for image optimisation.&lt;/li&gt;
&lt;li&gt;Take advantage of new image formats, as supported by end users' browsers, to improve the page load experience.&lt;/li&gt;
&lt;/ol&gt;
&lt;h2&gt;Final Thoughts&lt;/h2&gt;
&lt;p&gt;Peakhour image optimisation runs on Peakhour Edge. Images are optimised as they pass through the Peakhour network, and
optimised versions are cached for reuse. Peakhour image optimisation also works with &lt;a href="/blog/cdn-origin-shield"&gt;Origin Shield&lt;/a&gt;,
with the original and transformed images cached appropriately. This reduces origin hits and bandwidth while speeding up
image delivery.&lt;/p&gt;</content><category term="Features"></category><category term="Web Performance"></category><category term="Caching"></category><category term="Core Web Vitals"></category><category term="CDN"></category><category term="Drupal"></category><category term="Rate Limiting"></category></entry><entry><title>AVIF Support For Automatic Image Optimisation</title><link href="https://www.peakhour.io/blog/automatic-avif-for-supported-browsers/" rel="alternate"></link><published>2020-11-02T13:00:00+11:00</published><updated>2020-11-02T13:00:00+11:00</updated><author><name>Dan</name></author><id>tag:www.peakhour.io,2020-11-02:/blog/automatic-avif-for-supported-browsers/</id><summary type="html">&lt;p&gt;AVIF is a next generation image format with early support in Chrome and Firefox. Peakhour is pleased to offer AVIF as a supported format to our clients.&lt;/p&gt;</summary><content type="html">&lt;p&gt;Today we're adding support for the &lt;a href="/products/image-optimisation-and-transformation/"&gt;AVIF&lt;/a&gt; image format to our automatic image optimisation
and image manipulation API. AVIF is currently supported in Chrome Desktop (version 85 and up) and has experimental
support in Firefox. Since Chrome support comes via Chromium, other Chromium browsers, including Edge and Opera, are
expected to support AVIF by the end of the year.&lt;/p&gt;
&lt;p&gt;AVIF has several practical benefits over legacy image formats like JPEG, PNG, and WebP.&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;Much smaller file sizes for the same picture and quality.&lt;/li&gt;
&lt;li&gt;HDR and wide colour gamut support.&lt;/li&gt;
&lt;li&gt;Support for transparency (unlike JPEG)&lt;/li&gt;
&lt;li&gt;Support for animation (unlike JPEG)&lt;/li&gt;
&lt;/ul&gt;
&lt;h2&gt;A Quick Background of AVIF&lt;/h2&gt;
&lt;p&gt;AVIF is a next generation image format derived from the AV1 video codec developed by the Alliance for Open Media,
a collaboration between Google, Microsoft, Netflix, Arm, Amazon and others. It uses the same HEIF
container as the HEIC format used on iPhones/iPads and offers similar file sizes. However, Apple's HEIC format is based on
a commercial, patented codec, so anyone else wanting to adopt HEIC has to pay costly licensing fees.
Another next generation format, JPEG XR, developed as a successor to JPEG, was also never widely adopted because of its expensive
licensing requirements.&lt;/p&gt;
&lt;p&gt;The AV1 codec was developed to be open source and royalty free, addressing the current maze of patent and licensing
issues with existing formats. The companies behind the Alliance for Open Media have guaranteed to defend the format
against patent challenges.&lt;/p&gt;
&lt;h2&gt;How does it compare?&lt;/h2&gt;
&lt;p&gt;&lt;em&gt;NOTE: If you are interested in a technical in-depth comparison between AVIF, JPEG, and WebP, then check out &lt;a href="https://netflixtechblog.com/avif-for-next-generation-image-coding-b1d75675fe4"&gt;this post from Netflix&lt;/a&gt;.&lt;/em&gt;&lt;/p&gt;
&lt;p&gt;The two most popular image formats on the web today are JPEG and WebP. JPEG was introduced in 1992 and is still very widely
used, despite its age. WebP was introduced by Google around 2010 and has only just gained wide browser support.&lt;/p&gt;
&lt;p&gt;The first (and main) advantage of AVIF is that file sizes are much smaller than either JPEG or WebP for the same quality image.
In &lt;a href="https://www.ctrl.blog/entry/webp-avif-comparison.html"&gt;recent testing&lt;/a&gt; WebP had a 30% advantage over JPEG while
AVIF was 50% smaller than JPEG. Our own testing has shown similar results. If you are willing to accept a small loss in
image quality, then the improvements become more substantial; we'll look at these results in a separate blog post. If you
want to see what difference AVIF will make to your website, try &lt;a href="/pages/page-weight"&gt;our pageweight report&lt;/a&gt;.&lt;/p&gt;
&lt;p&gt;The second advantage of AVIF is wide colour and HDR support. You might have seen Apple and others touting their
'wide colour gamut' and High Dynamic Range (HDR) displays. Colour gamut refers to the number of colours a display can
reproduce, while HDR lets a display render extra levels of brightness for each colour, creating more realistic colour
transitions and revealing more detail in both shadows and highlights. Both JPEG and WEBP have a maximum of 8-bit colour
depth (256 levels per colour), so they can't take advantage of these newer displays, a major reason why Apple moved to HEIC in iOS.
AVIF supports 10-bit (1024 levels) and 12-bit (4096 levels) colour depths, which can make full use of
these higher-quality displays.&lt;/p&gt;
&lt;p&gt;Finally, unlike JPEG, but like WebP, AVIF supports transparency and can be lossy or lossless. It can also store
a series of animated frames (like animated GIFs).&lt;/p&gt;
&lt;h2&gt;Drawbacks&lt;/h2&gt;
&lt;p&gt;Right now the two issues with AVIF are lack of progressive rendering and the speed of encoding. The lack of
progressive rendering means nothing is displayed on screen until the image is fully loaded. JPEGs in comparison can
display a low quality approximation very early in the load process, which can make the website appear to load faster. This
is offset somewhat by AVIF's smaller file sizes, as the full images will be downloaded sooner.&lt;/p&gt;
&lt;p&gt;Encoding speed is a problem for the server; large images can take a few seconds on fast CPUs. However, encoders will
improve and direct hardware support will grow.&lt;/p&gt;
&lt;h2&gt;AVIF for Peakhour clients&lt;/h2&gt;
&lt;p&gt;Peakhour has rolled out AVIF support around the world. For the time being, though, we will not be supporting animation.
Peakhour clients don't have to take any action to start seeing the benefits of AVIF. Supported browsers will simply
start loading smaller images.&lt;/p&gt;
&lt;p&gt;Due to the time taken to encode AVIFs, especially large ones, Peakhour is taking the encoding out of line, even for
image API requests. If the AVIF generation is taking too long we'll return a JPEG or WebP, depending on the browser
Accept header, until the AVIF is ready to be served from our cache.&lt;/p&gt;
&lt;p&gt;AVIF should reduce pageweight for clients whose visitors use supported browsers. Even though
internet connections are getting faster, transfer size reductions are still as important as ever.&lt;/p&gt;</content><category term="Features"></category><category term="Core Web Vitals"></category></entry><entry><title>Instant Alerts</title><link href="https://www.peakhour.io/blog/instant-alerts/" rel="alternate"></link><published>2019-05-31T13:00:00+10:00</published><updated>2019-05-31T13:00:00+10:00</updated><author><name>Dan</name></author><id>tag:www.peakhour.io,2019-05-31:/blog/instant-alerts/</id><summary type="html">&lt;p&gt;Introducing Instant Alerts, a new feature for receiving emails or SMS alerts when events happen on your site.&lt;/p&gt;</summary><content type="html">&lt;p&gt;We've introduced Instant Alerts, an optional service that notifies you when there is a problem with your site. You can specify the email addresses and/or mobile numbers that should receive the alerts.&lt;/p&gt;
&lt;p&gt;At the moment you can receive alerts when your origin server:&lt;/p&gt;
&lt;ol&gt;
&lt;li&gt;Times out&lt;/li&gt;
&lt;li&gt;Cannot be reached at all&lt;/li&gt;
&lt;li&gt;Returns an error&lt;/li&gt;
&lt;/ol&gt;
&lt;p&gt;To avoid repeated messages, each alert has a cooldown limit you can set from 30 minutes to 24 hours.&lt;/p&gt;
&lt;p&gt;If you're using a service like Pingdom to check that your site is up, you probably will want to enable Instant Alerts.
Services like Pingdom might be served pages from our cache while your origin server is actually down.&lt;/p&gt;</content><category term="Features"></category><category term="DDoS"></category><category term="Threat Detection"></category><category term="DNS"></category><category term="CDN"></category><category term="Web Performance"></category></entry></feed>