Template isn't being rendered

Question

I am developing a WordPress website using a minimalist JavaScript framework + Timber. I have noticed that between pages, there is about 1500ms delay. I wanted to use W3 Total Cache, or WP Super Cache to see if I can use the cache features so it can load the pages faster.

It does seem to be faster, however I have some rendering problems. Because i'm using Timber, I have partial templates, one example looks like this.

Contacts.twig

{% extends "_base.twig" %}

{% block content %}
    {% if not isAJAX %}<section>{% endif %}        
        <div>
            <div>
                <section> 
                    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Necessitatibus quis doloribus libero et harum, molestiae, nam alias voluptatem sequi rem inventore aliquid reiciendis</p>
                </section>
            </div>
        </div>
    {% if not isAJAX %}</section>{% endif %}
{% endblock %}

When I activate W3 Total Cache, when I reload this page, http://example.com/contact, it only renders out this particular HTML strings, there is no header or footer, meaning it does not render out the _base.twig.

In my contact.php, it looks like

<?php
/**
 * Template Name: Contact Template
 */

$context = Timber::get_context();

Timber::render('views/contact/contact.twig', $context);

Are there any Timber/WordPress experts who know how I can use W3 Total Cache correctly?

Nam

It work if you disable W3 total Cache or other cache plugins? – Grunt

Yes of course, works normally without any cache plugin enabled. – Nam

take a look this, maybe it interest you github.com/timber/timber/wiki/Performance#cache-everything – Grunt

Answer 1

I had this issue too. I use Fast Velocity Minify along with W3 and it fixed my load speed issue. Below are some links that may work too. I finally reached a score of 90 for mobile and desktop after tweaking for a while. Let me Know if this works.

https://wordpress.org/support/topic/how-to-fix-render-blocking-java-script-in-wordpress/

Speed Booster Pack Plug In https://wordpress.org/support/topic/can-i-use-along-with-w3-cache/

Phil

Answer 2

W3 Total Cache will skip the Twig/Timber layer of your files and serve static pages via whatever mechanism the plugin or settings dictate.

Cache the Entire Twig File and Data

When rendering, use the $expires argument in Timber::render. For example:

$data['posts'] = Timber::get_posts();
Timber::render('index.twig', $data, 600);

Timber will cache the template for 10 minutes (600 / 60 = 10). But here's the cool part. Timber hashes the fields in the view context. This means that as soon as the data changes, the cache is automatically invalidated (yay!).

Full Parameters:

Timber::render(
    $filenames,
    $data,
    $expires, /** Default: false. False disables cache altogether. When passed an array, the first value is used for non-logged in visitors, the second for users **/
    $cache_mode /** Any of the cache mode constants defined in TimberLoader **/
);

For more information click here

Atlantic

@Nam you check my answer – Atlantic