1

enter image description here

As the screenshot show, there is 1.05s waiting time on page load and I have done some tests to figure it out that this is caused by https.

I uploaded a plain html with just hello world and tested with both http and https, with http the wait time was just around 300ms while with https it was around 1s.

Does anyone know why and how to optimize that? I have researched a lot and confirmed that the server is running http/2, keep alive is on, and static contents caching is on.

Is there anything I can do to improve the wait time? Any advice would be appreciated.

  • 2
    A long time between the request and the response usually means that the server is spending a long time thinking about the request. For static files, this usually indicates a very overloaded server. – Stephen Ostermiller Oct 15 '17 at 11:02
  • Have you talked to your webhost?! – Simon Hayter Oct 15 '17 at 11:23
  • @SimonHayter Not yet, just want to try everything I could do first before talking to the host. As without SSL the waiting time is less than 300ms and I think it is acceptable, but with SSL its over 1 sec and I think its far too long! I suspect it's could be something to do between secure and authenticated connection between CloudFlare and the web server? – Samuel L Oct 15 '17 at 11:46
  • SSL will always be slower than a non-encrypted connection, furthermore I recommend that you test your server within a range of regions, using one region or two, is not reliable to say the least, use webpage speed test and test your target region with 9 passes 20mbit. – Simon Hayter Oct 15 '17 at 12:54
  • Setting up HTTPS uses some computation cycles. With an overloaded server, HTTPS just magnifies the problem. – Stephen Ostermiller Oct 16 '17 at 6:44
2

Cloudflare by default does not cache HTML content. I suggest that you write a Page Rule to cache static HTML. Here we go:

  1. login to your cloudflare account
  2. using the dropdown in the top-left, select your domain name
  3. click the page rules app in the top of the menu (for added convenience and clarity, the icon below is exactly what you're looking for):

enter image description here

  1. Next, create a pattern & then apply a rule to that pattern. This requires you find a way to distinguish static vs. dybamic content by the URL. Some possibilities of accomplishing this are included below:

option a. to create a directory for static content, append a unique extension to static pages:

example.com/static/ [/static/ subdirectory for static HTML pages]

option b. appending a unique file extension to static pages:

example.com/.shtml [.shtml file extension to signify HTML that is static]

option c. adding a query parameter to mark the content as static:

example.com/?static=true [adding static=true query parameter]

The objective is to design the pattern to ONLY describe pages you know are static, of course.

  1. Click Cache everything in the Custom caching dropdown menu.
  2. Click Add Rule.

If at this point your HTML is not being cached, despite the cache everything rule, it means you need to override the origin cache directive with an "Edge Cache TTL" setting. Be sure that you set the edge cache TTL in Cloudflare even if the origin is sending the correct cache TTL headers - because again - Cloudflare will not cache HTML by default.

Hopefully this helps!

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.