Sean Michaud

<p>Optimize Scripts & Styles optimizes your site’s JavaScript and CSS files by combining, minifying and caching them. This will help your site’s overall performance and user experience by reducing the number of files served up and the overall size of these files.</p>
<p>For developers, this allows you to maintain uncompressed versions for development themes or plugins, while compressing them for a production environment.</p>
<p>For you SEO buffs, it cleans up the number of scripts that get included and downloaded to your site visitors, helping your overall PageSpeed score.</p>
<p>Header and footer script locations are maintained as well as any localized data used for the scripts and the minified files are stored in the /cache folder, making it friendly for plugins like WP Super Cache. Media attributes are also maintained for print stylesheets.</p>
<h3>Features</h3>
<ul>
<li>Combine & minify all JavaScript & CSS that is enqueued</li>
<li>Stores the optimized files in the cache folder for faster page loads</li>
<li>Compatible with caching plugins like WP Super Cache and W3 Total Cache</li>
<li>Enable for logged in users (not recommended)</li>
<li>Available options to remove or ignore enqueued scripts and styles</li>
<li>Optional button in the admin bar to clear scripts and styles</li>
<li>Includes an option to remove script type attributes for HTML5 validation</li>
</ul>


Optimize Scripts & Styles

Optimize Scripts & Styles combines scripts and styles on your site, minifies them and provides cachable versions for improved site performance.

Mark Jaquith

<p>Encute provides a fluent, declarative API for site owners to manipulate the scripts and styles that WordPress, themes, and plugins shove onto their site. Move things into the footer, defer loading, remove assets entirely. Or load scripts async, or as modules, or as nomodule!</p>
<p>Here’s an example of how you could use the plugin:</p>
<pre><code><?php

use CWS\Encute\{ Plugin, Script, Style };

add_action(Plugin::class, function (Plugin $plugin) {
    $isContactPage = fn () => is_page('contact');
    Script::get('contact-form-7')->keepIf($isContactPage)->footer()->defer();
    Style::get('contact-form-7')->keepIf($isContactPage)->footer()->defer();

    Style::get(['mediaelement', 'wp-mediaelement'])->footer()->defer();
    Style::get('material-icons')->defer();
    Script::get('jquery')->remove();
});
</code></pre>
<h3>Wrapper</h3>
<p>Always run code in this wrapper:</p>
<pre><code>add_action(\CWS\Encute\Plugin::class, function (\CWS\Encute\Plugin $encute) {
    // Your code here.
});
</code></pre>
<p>This wrapper will be a no-op if Encute is not available, and it will both wait for Encute to be available to run, and pass you Encute’s main class instance.</p>
<h3>Fluency</h3>
<p>Both <code>Script::get()</code> and <code>Style::get()</code> return an instance of themselves, as do all calls to their methods, so you can just chain your calls.</p>
<h3>Script</h3>
<ul>
<li><code>static CWS\Encute\Script::get(string $handle): CWS\Encute\Script</code> — get a Script instance for that handle.</li>
<li><code>CWS\Encute\Script::module(): CWS\Encute\Script</code> — make the script a module.</li>
<li><code>CWS\Encute\Script::noModule(): CWS\Encute\Script</code> — make the script nomodule.</li>
<li><code>CWS\Encute\Script::footer(): CWS\Encute\Script</code> — send the script to the footer (along with its entire dependency family).</li>
<li><code>CWS\Encute\Script::async(): CWS\Encute\Script</code> — make the script async.</li>
<li><code>CWS\Encute\Script::defer(): CWS\Encute\Script</code> — make the script defer.</li>
<li><code>CWS\Encute\Script::remove(): CWS\Encute\Script</code> — remove the script.</li>
<li><code>CWS\Encute\Script::removeIf(callable $callback): CWS\Encute\Script</code> — remove the script if the callback resolves as true.</li>
<li><code>CWS\Encute\Script::keepIf(callable $callback): CWS\Encute\Script</code> — keep the script if the callback resolves as true (else remove it).</li>
</ul>
<h3>Style</h3>
<ul>
<li><code>static CWS\Encute\Style::get(string $handle): CWS\Encute\Style</code> — get a Style instance for that handle.</li>
<li><code>CWS\Encute\Style::footer(): CWS\Encute\Style</code> — send the style to the footer (along with its entire dependency family).</li>
<li><code>CWS\Encute\Style::defer(): CWS\Encute\Style</code> — defer the style’s loading.</li>
<li><code>CWS\Encute\Style::remove(): CWS\Encute\Style</code> — remove the style.</li>
<li><code>CWS\Encute\Style::removeIf(callable $callback): CWS\Encute\Style</code> — remove the style if the callback resolves as true.</li>
<li><code>CWS\Encute\Style::keepIf(callable $callback): CWS\Encute\Style</code> — keep the style if the callback resolves as true (else remove it).</li>
</ul>


Encute

Fluent API for site owners to manipulate the scripts and styles on the frontend of their site.

Optimize Scripts & Styles vs Encute