Egenverk Lagom · Documentation

CSS and JS

The CSS and JS per page module sits on the Advanced tab, which you first turn on for yourself, see Getting started. It shows which files each kind of page loads and lets you stop a file on chosen page types, or a whole plugin on chosen addresses. The module is off by default.

Lagom never rewrites or combines code. It always stops a whole file or a whole plugin, and every rule starts as a preview.

Scan the pages

With the module on, the card shows one link per kind of page: front page, shop, cart, checkout, my account, a product, a product category, a blog post, the dashboard and orders. Open each once while logged in. You scan any other page by adding ?egenverk_lagom_assets=scan to its address.

Lagom records every CSS and JS file the page printed, and a note on the page confirms what was recorded. Under Scanned files the files are grouped by plugin, theme or WordPress, largest first:

• Handle and type, CSS or JS
• size and inline code
• File served, whether it is minified and whether the other build is on disk
• Loads on: the page types the file loads on
• Needed by: files that depend on it
• Last run: what the last coverage run saw

Scans are kept per page type, at most 40 page types with 300 files each. The page types are front page, blog, page (per page template), single per post type, search, 404, archive, shop, product, product category, cart, checkout, order-pay, order-received, account and each admin screen. Requests without the scan argument are not affected, and a scanned page is kept out of page caches.

File rules

Click Unload… next to a file, tick the page types under Stop loading it on and click Add as preview.

Preview: a new rule applies only when an administrator opens a page with ?egenverk_lagom_assets=preview. The page types next to the rule link to the preview, and a note on the page says how many rules were applied.

A rule is refused when

• it targets Lagom's own page, so a bad rule can always be undone
• it targets WooCommerce's order screens in wp-admin, where refunds and payment captures run
• it targets order-pay or order-received, which need a real order and can never be verified
• the file was not seen on that page type in the last scan
• the file comes from a payment, shipping, cache, security, cookie consent, language or code snippets plugin and the page type is a product, shop, cart, checkout or account page
• a file that depends on it would still load on that page type

Make live: a rule goes live after a passed verification, see below. Without one, an administrator can make it live by ticking "No verification run has passed. I have checked the preview myself and take the risk; this is logged." That is logged and the rule is marked verification skipped. Rules on product, shop, product category, cart, checkout and account pages can never skip the verification.

WordPress adds a removed file back when something that loads depends on it. A rule therefore only goes live once the rules for the files that depend on it are live, and a rule other live rules depend on cannot leave live first.

A rule can go Back to preview or be deleted with Delete. After every change, known page caches are emptied (WP Rocket, LiteSpeed Cache, W3 Total Cache, where only the page cache is emptied, and WP Super Cache). Otherwise Lagom asks you to empty the cache. Change log keeps the last 200 rule changes with who, when and what.

?egenverk_lagom_assets=off turns every rule off for a single request.

Coverage and verification

A coverage run measures which files each page type actually uses. It runs in a headless browser on your own computer with the bin/lagom-coverage tool from the plugin's source. The tool is not part of the plugin's zip file. Contact us if you want to use it.

Plan: under Coverage runs you tick one page per page type under Include, add addresses of your own under More addresses and click Save plan. One page per page type is enough: all category pages count as one.

Run key: Create run key shows the key once, with the commands to measure and to verify. It is valid for 30 minutes, for your user and that run only. It is stored only as a hash, logged in Run log and can be revoked with Revoke, which also ends the login it handed out. A new key retires your previous one.

Results: per file and page type Lagom shows unused here, start-up only, fonts or animations only, check by eye or used, with the share of the file that was used. Every page is visited at a desktop and a phone size.

Proposed rules: after a run, Lagom lists per page type CSS with no matching rule (ticked) and JS that only ran its start-up code (left for you to choose). Add ticked as preview rules adds them as previews.

Verification: the verification run opens every page type that has rules in preview, with the rules off and on, and compares console errors, failed requests, interactions that stop working and the layout. The rules show per page type verified, verification failed with the reasons, rules changed, verify again or not verified. A passed verification covers exactly the rules on that page type, and rules verified together go live together. The notification lists them.

Production is read-only: when WordPress's environment type is production, the run blocks tracking, aborts every request that is not GET, never leaves the page it opened and clicks nothing in wp-admin. Product, shop, product category, cart and checkout pages pass only in a full run, which can fill a cart, that is, on a test site. Account pages can pass in a read-only run too.

Whole plugins per address

A plugin rule stops an active plugin from loading at all, its PHP, CSS and JS, on chosen addresses. A normal plugin loads too late to stop others, so this needs a small must-use plugin, egenverk-lagom-plugin-filter.php in wp-content/mu-plugins/. Lagom writes it only when you click Install the mu-plugin. The card shows its state: Not installed: plugin rules do nothing., Installed and up to date. or Installed by another Lagom version: update it. An old version is replaced automatically when an administrator opens the admin, and Remove the mu-plugin removes it.

To add a rule: choose the Plugin, choose under Switch it off either on addresses starting with or on exactly this address, fill in the Address, for example /blog/, and click Add plugin rule as preview. The address must cover at least one scanned page, so the rule can be verified. Prefixes match whole path segments: /blog/ covers /blog/x/ but not /blog-posts/. Upper and lower case and index.php make no difference.

These are never switched off: WooCommerce, Lagom, plugins for payment, shipping, cache, security, cookie consent, language or currency and code snippets, and plugins another active plugin requires. They cannot be chosen.

The must-use plugin does nothing

• in wp-admin, on AJAX, REST, cron, WP-CLI or XML-RPC
• on logins, form submissions (only GET and HEAD count), WooCommerce API callbacks, previews, feeds, sitemaps, robots.txt or searches
• on cart, checkout, account and order pages, which are always on the never-list and follow along if you change or rename those pages in WooCommerce
• on the addresses in the Never-list, one per line, which you save with Save never-list
• with plain permalinks, or when Lagom is not active

If anything saves the list of active plugins while a rule has shortened it, the switched-off plugins are put back, so they are never deactivated site-wide.

Plugin rules go through the same steps as file rules: preview, verification, live and log. A plugin rule cannot go live without the current must-use plugin.

To stop every plugin rule at once:

• deactivate Lagom, which removes the file and empties the page cache. The rules are kept, and they apply again once you install the must-use plugin again.
• add define( 'EGENVERK_LAGOM_RULES_OFF', true ); to wp-config.php
• delete the file in wp-content/mu-plugins/

Switching the module off removes the file too.

PageSpeed Insights

As a second opinion, the PageSpeed Insights section, labelled estimate, public pages only, lists every scanned public page type. Choose the Device, mobile or desktop, and click Run PageSpeed. Google opens the page once, logged out and with an empty cart, clicks nothing, and reports the score, LCP, TBT and CLS and how much of each CSS and JS file went unused. The results create no rules. A result where Google was sent on to another page is not stored.

The API key is optional. Without one, Google allows only a few runs a day. Save the key with Save key, remove it with Remove key, or set the EGENVERK_LAGOM_PSI_KEY constant in wp-config.php, see Reference. The key is never shown again. It is sent only in the server's request to Google and is scrubbed from error messages. The address sent is always a scanned page of your site.