What You Should Know About HTML5 Dynamic Content

Datapath.io
6 min readAug 30, 2016

--

HTML has a new update. Well, a new update as of 2014.

HTML5 will effect how much dynamic content is created, as it is now easier to incorporate into websites. HTML5 is designed to give developers freedom and enhance web speed, but dynamic content can cause slower web performance.

If HTML5 is designed for speed, then how can dynamic content cause slower performance?

The answer lies in how dynamic content is delivered to users.

First, we need to discuss HTML5 and HTML5 dynamic content.

What is HTML5?

Understanding the HTML5 updates will let us know what is possible using web technologies.

Simply put, HTML5 is the latest web programming language. The first version of HTML was developed in 1989 and HTML 4 was created in 1997. This means almost 10 years passed between HTML4 and HTML5. We are due for an update.

HTML5 is the latest version of the hypertext markup language (HTML), and this version is built for dynamic content and speed.

A few updates to highlight are:

  • Embedded streaming
  • Interactive elements
  • Mobile capabilities
  • Vector images
  • Drag and drop web capabilities
  • Running web apps offline
  • Real-time web apps with web sockets
  • Less 3rd party integrations
  • Better web browser cloud integration

HTML5 provides web developers the ability to incorporate more dynamic content into their website. This is HTML5 dynamic content.

The HTML5 goal is to provide the user an experience that is less about the technology and more about experience immersion.

What is HTML5 Dynamic Content?

HTML5 makes incorporating dynamic content into your website easier and faster.

In the days of HTML4, dynamic content, videos, and animated graphics all needed third party plugins. The most popular being flash. HTML5 makes flash unnecessary, which should be a delight to Apple users.

Content can now be embedded directly into web code, which means no more 3rd party plugins.

Dynamic content is videos, interactive forms, web application customer accounts, or animated graphics. It is any content that is generated by a specific user action, typically a cookie. The benefit is a personalized experience to users, but the downside is a strain on web performance.

The web performance strain comes from the fact that dynamic content always needs to be loaded from the origin server. Thus, your content delivery network (CDN) is going to strain when trying to load the content.

As HTML5 makes producing dynamic content easier, the logical result is more content will become dynamic. For the user experience, this is excellent.

What Should You Know About Dynamic Content?

The first thing you should know about dynamic content is the different names that could be used to describe it.

In the technical world, it will be referred to as dynamic content, but Marketers might refer to it with different terms. It is important to know what Marketers call it because they are going to want to produce a lot of dynamic content.

In Hubspot Marketing, you will refer to dynamic content as “Smart Content”. This might be a term your marketing department begins using. The alternative is going to be adaptive content. Whether it is dynamic content, smart content or adaptive content, all terms refer to content which changes based on user actions.

Dynamic content is one of the reasons you have website performance issues. This is assuming you have already employed web development best practices and are using a CDN. As the content needs to be requested from the origin server, network latency, bandwidth and throughput are going to play a large factor in the performance of your website.

Your Marketing Team Wants More of It

Dynamic content provides individual user experiences at scale. With the use of cookies, you can tailor your web experience to each user that visits. That means either turning a visitor into a lead or further engaging existing customers.

Any technology that will allow marketers to engage deeper with prospects and provide a unique experience, will be one that is rapidly adopted. Once adopted, marketers will produce a lot of it. The goal is to maximize conversions and bring more qualified leads to sales.

As a developer or network engineer you may roll your eyes, but if dynamic content is loading slow, this will hurt performance. Meaning the business will be affected. That is why dynamic content optimization is important. It will benefit the speed and reliability of your website and application.

The Pros and Cons of Dynamic Content

Dynamic content is a double edged sword. Let us take a look at a few HTML 5 dynamic content pros and cons:

Although dynamic content can improve your business, like anything, there are costs and benefits to using it at scale.

Dynamic Content Speed is Hurting Your Conversion Rates

Now that we understand the pros and cons, let’s take a look at the largest problem with dynamic content; loading speed.

Since dynamic content needs to be loaded from the origin server each time it is requested, the content caching benefits of a CDN do not improve load speed. As page speed is directly correlated with conversion rates, this is problematic.

Page load speed is affected by network latency and bandwidth. Therefore, if you cannot improve the geographic distances content travels, you need to affect the speed at which it travels. This is accomplished through dynamic content optimization.

To achieve dynamic content optimization, you need to construct an infrastructure that differentiates between static and dynamic content.

Separate Your Static and Dynamic

As more content becomes dynamic, network optimization will become a bigger factor in your network strategy. To do this, there needs to be a setup that separates static and dynamic content.

Two of the easiest ways are:

First is to use different subdomains, which looks like the following:

The second is to separate content into two different virtual private clouds (VPCs) or subnets within Amazon Web Services (AWS).

By doing this, you can send the traffic over different networks. The result is caching your static content on your CDN servers while sending dynamic content over an optimized Internet route.

Your CDN Cannot Optimize HTML5 Dynamic Content

The result of understanding HTML5 dynamic content is understanding that it needs to be treated differently. The difference is that dynamic content is not cacheable, and therefore you cannot optimize it with the use of your CDN.

That is why you will need to supplement your CDN with network optimization, addressing network latency and bandwidth management.

HTML5 is providing web developers freedom and code that is designed for speed. With more dynamic content, it is time to address the speed to your users.

Article originally published on the Datapath.io Blog.

--

--

Datapath.io

Cloud to Cloud Network - All your multi-cloud applications connected via a secure and dedicated private network https://datapath.io/