Niels van Kampenhout

Mar 30, 2018

HTTP/2 Content Delivery with BloomReach Experience

 

Today’s web pages are more resource-intensive than ever and the restrictions of the HTTP/1.1 protocol make it difficult to load them efficiently. HTTP/2, a major revision of the HTTP protocol, potentially provides a solution to this problem. It adds a number of improvements to the way browsers and server communicate, including:

  • Compression of HTTP headers, reducing overhead

  • Multiplexing, fixing the head-of-line-blocking problem in HTTP/1.1

  • Server push of resources into client caches, helping web pages to load faster

Lately, BloomReach has noticed an increased interest among customers and partners in HTTP/2. In this lab, we show you how to enable HTTP/2 content delivery in a BloomReach Experience environment. How to actually leverage the benefits of HTTP/2 in your implementation and how to measure any performance improvements are out of scope for this Lab but may be covered in future Labs.

 

Set Up Your Environment

 

Starting Point

Our starting point is a working Experience environment based on our standard supported stack comprised of Ubuntu 16.04, Oracle JVM 8, MySQL 5.7, Tomcat 8.5, and Apache HTTP Server 2.4.

To get to the same point, follow the instructions in the guide to Configure the Application Server. All major browsers support HTTP/2 only over an encrypted connection, so make sure you configure Apache HTTP Server for SSL offloading. Deploy your Experience project distribution and verify that both the CMS and site applications are working and accessible over HTTPS.

 

Verify Stack for HTTP/2 Support

The next step is to verify that all the relevant components of our stack support HTTP/2.

Tomcat added support for HTTP/2 in 8.5.0. If your environment is still using Tomcat 8.0, you’ll need to upgrade to 8.5 or 9.0.

Apache HTTP Server added support for HTTP/2 in 2.4.17. If you installed Apache from the standard stable Ubuntu 16.04 repository using apt, you are left without HTTP/2 support and you’ll need to upgrade to version 2.4.24 or later from a community-maintained package archive.

 

Configure Tomcat for HTTP/2

To enable support for HTTP/2 in your Tomcat installation, associate the HTTP/2 Upgrade Protocol with the existing HTTP/1.1 connector in server.xml. This only needs to be done for Tomcat’s default (non-SSL) connector (which is proxied by Apache):

/opt/cms/tomcat/conf/server.xml (fragment)

   <Connector port="8080" protocol="HTTP/1.1"
              connectionTimeout="20000"
              redirectPort="8443" >
     <UpgradeProtocol className="org.apache.coyote.http2.Http2Protocol"/>
   </Connector>

Configure Apache HTTP Server for HTTP/2

Enable the mod_http2 module:

$ sudo a2enmod http2

In your virtual host configuration, add the h2 protocol using the Protocols directive:

Protocols h2 http/1.1

Below is the full relevant virtual server configuration for the site application:

/etc/apache2/sites-available/site.conf

<VirtualHost *:443>
  ServerName www.example.com
  Protocols h2 http/1.1
  SSLEngine on

  SSLCertificateFile /etc/apache2/ssl/server.crt
  SSLCertificateKeyFile /etc/apache2/ssl/server.key

  <Location />
    Order deny,allow
    Allow from all
  </Location>

  RequestHeader set X-Forwarded-Proto https

  ProxyPreserveHost On

  ProxyPass / http://127.0.0.1:8080/site/
  ProxyPassReverse / http://127.0.0.1:8080/site/
  ProxyPassReverseCookiePath /site /
</VirtualHost>

 

Verify Site Delivery over HTTP/2

Restart Tomcat and Apache for the configuration changes to take effect. Using your browser’s Developer Tools, monitor network traffic while you access the site. If the Protocol column* shows ‘h2’, you successfully enabled HTTP/2 delivery in your Experience environment!

* If the table listing the requests doesn’t have a Protocol column, right-click on one of the column headers and check Protocol (this applies to Firefox and Chrome, other browsers may differ).

 

(Optional) Replace Apache with Nginx

In our experiments with the setup described above, response times were noticeably slower after switching Apache from HTTP/1.1 to HTTP/2. For comparison, we replaced Apache with Nginx and ran the same experiments. Page loads over HTTP/2 seemed faster with Nginx than with Apache. We would need to run more structured tests to draw any definite conclusions.

For completeness, the relevant Nginx configuration for the site application is provided below. Please note that Nginx is currently not part of our supported stacks, so use at your own risk.

/etc/nginx/sites-available/site

server {

 listen 443 ssl http2;

 server_name "www.example.com";

 ssl_certificate /etc/nginx/ssl/server.crt;
 ssl_certificate_key /etc/nginx/ssl/server.key;
 ssl_dhparam  /etc/nginx/ssl/dhparam.pem;

 location / {
   proxy_set_header Host $host;
   proxy_set_header X-Forwarded-Host $host;
   proxy_set_header X-Forwarded-Server $host;
   proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
   proxy_set_header X-Forwarded-Proto $scheme;

   proxy_pass http://localhost:8080/site/;
   proxy_redirect default;
   proxy_cookie_path /site/ /;
 }

}

 

Summary, Conclusion, and Next Steps

In this Lab, we enabled HTTP/2 delivery in a standard BloomReach Experience environment by configuring the application server and reverse proxy accordingly. We also experimented with replacing Apache with Nginx as a reverse proxy.

At this point, the main conclusion we can draw from our experiments is that BloomReach Experience supports HTTP/2 delivery out-of-the-box with a few simple configuration settings in the application server and reverse proxy. We can’t yet say anything definite about the performance benefits of HTTP/2 because for a large part they rely on the site implementation leveraging specific HTTP/2 features. In addition, measuring performance differences between HTTP/1.1 and HTTP/2 is not a 1:1 comparison due to their differences in the way browser and server communicate. At the request level, the more efficient use of connections enabled by HTTP/2 may be reflected by a lower total number of required requests but also by a higher average response time per request because more data is transferred. Instead, the time it takes to load an entire page including all its resources (images, stylesheets, scripts, etc.) should be measured and compared. This is outside the scope of this Lab.

With this Lab, you can start your own experiments with HTTP/2 delivery in your BloomReach Experience environment. You can start to implement new performance best practices that leverage the features of HTTP/2 and measure if there are any performance improvements. Share your experiences in the BloomReach developer forum!
 

Resources:

https://tools.ietf.org/html/rfc7540

https://http2.github.io/faq/

https://www.engadget.com/2015/02/24/what-you-need-to-know-about-http-2/

https://blog.newrelic.com/2016/02/09/http2-best-practices-web-performance/