Fumiki Takahashi

TAROSKY INC.

<p>This plugin optimize page rendering of WordPress theme.</p>
<h4>Features</h4>
<ul>
<li>Add <code>loading="lazy"</code> or <code>loading="eager"</code> with your images.</li>
<li>Add <code>defer</code> or <code>async</code> attributes to your scripts.</li>
<li>Add <code>rel="preload"</code> to your stylesheets. Polyfill for old browsers is also available.</li>
<li>Remove default script helper of embeds(twitter, instagram) and load one after user interaction.</li>
</ul>
<p>All of above are selectable and you can customize with white list.</p>
<h4>Case 1. Image Loading</h4>
<p>If you wish header logo(<code>.custom-logo</code>) and main post thumbnail(<code>.post-feature-image</code>) should be load faster because they are in first view.</p>
<p>Just put <code>custom-logo,post-feature-image</code> at <strong>High Priority</strong> section in your setting screen.</p>
<h4>Case 2. Stop Defer</h4>
<p>Defering JavaScripts sometimes breaks your site.<br />
For example, if a script requires just in time operation with inline script tag, it will fail.</p>
<pre><script id="some-script-js" src="somescript.js" defer></script>
<script>
new SomeScript();
</script></pre>
<p>To avoid this, Add <code>some-script</code> handle name in <strong>Deny Defer</strong> section in your setting screen.</p>
<p>Generally speaking, many JavaScripts loaded in your WordPress are issued by WordPress Core, plugins, themes, your custom code, and so on.</p>
<p>To optimize JavaScript loading, try and error approaches works fine.</p>
<h4>Case 3. Critical Stylesheet</h4>
<pre><code>rel="preload" attributes makes your stylesheets loaded asynchrounsely, but FOUC(Flush of Unstyled Content) happens.
</code></pre>
<p>To avoid this, include critical CSS to <strong>Deny List</strong> in your setting screen. Critical CSS are generally your theme’s main stylesheet.</p>


Render Faster

Render the page faster. Enhance your site's load page for Core Web Vital.

binarymoon

<p>Make browsing your website a more pleasant experience.</p>
<p>Uses the <a href="https://instant.page/" rel="nofollow ugc">Instant.Page</a> script to make browsing between pages on your website super fast.</p>
<p>The Instant.Page script prefetches pages that are about to be clicked on so that they start loading whilst you are on the current page. By the time you click on the link a lot of the loading process has happened and so the page appears to load much more quickly.</p>
<p>Increased website speed (even just the appearance of increased speed) improves user experience, and conversion rates, and stickiness, and all the good things that make users love you.</p>


Render Faster vs Tada: Instant Webpage Loading, Fast Website Browsing