Reduce Unused CSS Solution with Critical CSS For WP vs WP Super Cache

Critical CSS For WP removes the unused CSS which helps to paint fast and render the above fold content, before downloading the complete css files. We intends to provide great experience to the web page visitors by improving the performance of the web page. Works well with: WP Rocket Autoptimize Aruba HiSpeed Cache Breeze – WordPress Cache Clearfy Cache Cache Enabler GoDaddy Cache Hummingbird Kinsta Cache LiteSpeed Cache Nginx Helper Redis Object Cache SiteGround SuperCacher Speed Booster Pack ⚡ PageSpeed Optimization Suite WP Super Cache WP Fastest Cache W3 Total Cache WP-Optimize WPEngine Cache WP Speed of Light 10Web Booster – Website speed optimization, Cache & Page Speed optimizer We Act Fast on Feedback! We are actively developing this plugin and our aim is to make this plugin into the #1 solution for generating Critical CSS in the world. You can Request a Feature or Report a Bug. Technical Support Support is provided in Forum. Would you like to contribute? You may now contribute to this Critical CSS For WP plugin on Github: View repository on Github Credits CSS from HTML extractor Author: Jan Decavele URL: https://github.com/JanDC/css-from-html-extractor License: The MIT License (MIT) License URL: https://github.com/JanDC/css-from-html-extractor?tab=License-1-ov-file PHP Secure Communications Library Author: DataTables URL:https://github.com/DataTables/DataTables License: The MIT License (MIT) License URL: https://github.com/DataTables/DataTables?tab=MIT-1-ov-file

This plugin generates static html files from your dynamic WordPress blog. After a html file is generated your webserver will serve that file instead of processing the comparatively heavier and more expensive WordPress PHP scripts. The static html files will be served to the vast majority of your users: Users who are not logged in. Users who have not left a comment on your blog. Or users who have not viewed a password protected post. 99% of your visitors will be served static html files. One cached file can be served thousands of times. Other visitors will be served custom cached files tailored to their visit. If they are logged in, or have left comments those details will be displayed and cached for them. The plugin serves cached files in 3 ways (ranked by speed): Expert. The fastest method is by using Apache mod_rewrite (or whatever similar module your web server supports) to serve “supercached” static html files. This completely bypasses PHP and is extremely quick. If your server is hit by a deluge of traffic it is more likely to cope as the requests are “lighter”. This does require the Apache mod_rewrite module (which is probably installed if you have custom permalinks) and a modification of your .htaccess file which is risky and may take down your site if modified incorrectly. Simple. Supercached static files can be served by PHP and this is the recommended way of using the plugin. The plugin will serve a “supercached” file if it exists and it’s almost as fast as the mod_rewrite method. It’s easier to configure as the .htaccess file doesn’t need to be changed. You still need a custom permalink. You can keep portions of your page dynamic in this caching mode. WP-Cache caching. This is mainly used to cache pages for known users, URLs with parameters and feeds. Known users are logged in users, visitors who leave comments or those who should be shown custom per-user data. It’s the most flexible caching method and slightly slower. WP-Cache caching will also cache visits by unknown users if supercaching is disabled. You can have dynamic parts to your page in this mode too. This mode is always enabled but you can disable caching for known users, URLs with parameters, or feeds separately. Set the constant “DISABLE_SUPERCACHE” to 1 in your wp-config.php if you want to only use WP-Cache caching. If you’re not comfortable with editing PHP files then use simple mode. It’s easy to set up and very fast. Recommended Settings Simple caching. Compress pages. Don’t cache pages for known users. Cache rebuild. CDN support. Extra homepage checks. Garbage collection is the act of cleaning up cache files that are out of date and stale. There’s no correct value for the expiry time but a good starting point is 1800 seconds. Consider deleting the contents of the “Rejected User Agents” text box and allow search engines to cache files for you. Preload as many posts as you can and enable “Preload Mode”. Garbage collection of old cached files will be disabled. If you don’t care about sidebar widgets updating often set the preload interval to 2880 minutes (2 days) so all your posts aren’t recached very often. When the preload occurs the cache files for the post being refreshed is deleted and then regenerated. Afterwards a garbage collection of all old files is performed to clean out stale cache files. Even with preload mode enabled cached files will still be deleted when posts are modified or comments made. Development Active development of this plugin is handled on GitHub. Translation of the plugin into different languages is on the translation page. Documentation If you need more information than the following, you can have a look at the wiki or the Developer documentation. Preloading You can generate cached files for the posts, categories and tags of your site by preloading. Preloading will visit each page of your site generating a cached page as it goes along, just like any other visitor to the site. Due to the sequential nature of this function, it can take some time to preload a complete site if there are many posts. To make preloading more effective it can be useful to disable garbage collection so that older cache files are not deleted. This is done by enabling “Preload Mode” in the settings. Be aware however, that pages will go out of date eventually but that updates by submitting comments or editing posts will clear portions of the cache. Garbage Collection Your cache directory fills up over time, which takes up space on your server. If space is limited or billed by capacity, or if you worry that the cached pages of your site will go stale then garbage collection has to be done. Garbage collection happens on a regular basis and deletes old files in the cache directory. On the advanced settings page you can specify: 1. Cache timeout. How long cache files are considered fresh for. After this time they are stale and can be deleted. 2. Scheduler. Setup how often garbage collection should be done. 3. Notification emails. You can be informed on garbage collection job progress. There’s no right or wrong settings for garbage collection. It depends on your own site. If your site gets regular updates, or comments then set the timeout to 1800 seconds, and set the timer to 600 seconds. If your site is mostly static you can disable garbage collection by entering 0 as the timeout, or use a really large timeout value. The cache directory, usually wp-content/cache/ is only for temporary files. Do not ever put important files or symlinks to important files or directories in that directory. They will be deleted if the plugin has write access to them. CDN A Content Delivery Network (CDN) is usually a network of computers situated around the world that will serve the content of your website faster by using servers close to you. Static files like images, Javascript and CSS files can be served through these networks to speed up how fast your site loads. You can also create a “poor man’s CDN” by using a sub domain of your domain to serve static files too. OSSDL CDN off-linker has been integrated into WP Super Cache to provide basic CDN support. It works by rewriting the URLs of files (excluding .php files) in wp-content and wp-includes on your server so they point at a different hostname. Many CDNs support origin pull. This means the CDN will download the file automatically from your server when it’s first requested, and will continue to serve it for a configurable length of time before downloading it again from your server. Configure this on the “CDN” tab of the plugin settings page. This is an advanced technique and requires a basic understanding of how your webserver or CDNs work. Please be sure to clear the file cache after you configure the CDN. REST API There are now REST API endpoints for accessing the settings of this plugin. You’ll need to be authenticated as an admin user with permission to view the settings page to use it. This has not been documented yet but you can find all the code that deals with this in the “rest” directory. Custom Caching It is now possible to hook into the caching process using the add_cacheaction() function. Three hooks are available: ‘wp_cache_get_cookies_values’ – modify the key used by WP Cache. ‘add_cacheaction’ – runs in phase2. Allows a plugin to add WordPress hooks. ‘cache_admin_page’ – runs in the admin page. Use it to modify that page, perhaps by adding new configuration options. There is one regular WordPress filter too. Use the “do_createsupercache” filter to customize the checks made before caching. The filter accepts one parameter. The output of WP-Cache’s wp_cache_get_cookies_values() function. WP Super Cache has its own plugin system, loaded before most of WordPress. Add your own plugin either by putting it in the wp-content/plugins/wp-super-cache-plugins directory, or by calling wpsc_add_plugin( $name ) with the full path to the plugin. The cookies used to identify “known users” can be modified with wpsc_add_cookie( $name ) and wpsc_delete_cookie( $name ). See plugins/searchengine.php as an example. Troubleshooting If things don’t work when you installed the plugin here are a few things to check: Is wp-content writable by the web server? Is there a wp-content/wp-cache-config.php ? If not, copy the file wp-super-cache/wp-cache-config-sample.php to wp-content/wp-cache-config.php and make sure WPCACHEHOME points at the right place. Is there a wp-content/advanced-cache.php ? If not, then you must copy wp-super-cache/advanced-cache.php into wp-content/. You must edit the file and change the path so it points at the wp-super-cache folder. If pages are not cached at all, remove wp-content/advanced-cache.php and recreate it, following the advice above. Make sure the following line is in wp-config.php and it is ABOVE the “require_once(ABSPATH.’wp-settings.php’);” line: define( 'WP_CACHE', true ); Try the Settings->WP Super Cache page again and enable cache. Look in wp-content/cache/supercache/. Are there directories and files there? Anything in your php error_log? If your browser keeps asking you to save the file after the super cache is installed you must disable Super Cache compression. Go to the Settings->WP Super Cache page and disable it there. File locking errors such as “failed to acquire key 0x152b: Permission denied in…” or “Page not cached by WP Super Cache. Could not get mutex lock.” are a sign that you may have to use file locking. Edit wp-content/wp-cache-config.php and uncomment “$use_flock = true” or set $sem_id to a different value. You can also disable file locking from the Admin screen as a last resort. Make sure cache/wp_cache_mutex.lock is writable by the web server if using coarse file locking. The cache folder cannot be put on an NFS or Samba or NAS share. It has to be on a local disk. File locking and deleting expired files will not work properly unless the cache folder is on the local machine. Garbage collection of old cache files won’t work if WordPress can’t find wp-cron.php. Check your access_logs for wp-cron.php entries and that your hostname resolves to the external IP address other servers on the network/Internet use. If old pages are being served to your visitors via the supercache, you may be missing Apache modules (or their equivalents if you don’t use Apache). 3 modules are required: mod_mime, mod_headers and mod_expires. The last two are especially important for making sure browsers load new versions of existing pages on your site. The error message, “WP Super Cache is installed but broken. The path to wp-cache-phase1.php in wp-content/advanced-cache.php must be fixed!” appears at the end of every page. Open the file wp-content/advanced-cache.php in your favourite editor. Is the path to wp-cache-phase1.php correct? This file will normally be in wp-content/plugins/wp-super-cache/. If it is not correct the caching engine will not load. Caching doesn’t work. The timestamp on my blog keeps changing when I reload. Check that the path in your .htaccess rules matches where the supercache directory is. You may have to hardcode it. Try disabling supercache mode. If supercache cache files are generated but not served, check the permissions on all your wp-content/cache/supercache folders (and each of wp-content cache and supercache folders) and wp-content/cache/.htaccess. If your PHP runs as a different user to Apache and permissions are strict Apache may not be able to read the PHP generated cache files. To fix you must add the following line to your wp-config.php (Add it above the WP_CACHE define.) Then clear your cache. umask( 0022 ); If you see garbage in your browser after enabling compression in the plugin, compression may already be enabled in your web server. In Apache you must disable mod_deflate, or in PHP zlib compression may be enabled. You can disable that in three ways. If you have root access, edit your php.ini and find the zlib.output_compression setting and make sure it’s “Off” or add this line to your .htaccess: php_flag zlib.output_compression off If that doesn’t work, add this line to your wp-config.php: ini_set('zlib.output_compression', 0); After uninstalling, your permalinks may break if you remove the WordPress mod_rewrite rules too. Regenerate those rules by visiting the Settings->Permalink page and saving that form again. If your blog refuses to load make sure your wp-config.php is correct. Are you missing an opening or closing PHP tag? Your front page is ok but posts and pages give a 404? Go to Settings->permalinks and click “Save” once you’ve selected a custom permalink structure. You may need to manually update your .htaccess file. If certain characters do not appear correctly on your website your server may not be configured correctly. You need to tell visitors what character set is used. Go to Settings->Reading and copy the ‘Encoding for pages and feeds’ value. Edit the .htaccess file with all your Supercache and WordPress rewrite rules and add this at the top, replacing CHARSET with the copied value. (for example, ‘UTF-8’) AddDefaultCharset CHARSET The error message, “WP Super Cache is installed but broken. The constant WPCACHEHOME must be set in the file wp-config.php and point at the WP Super Cache plugin directory.” appears at the end of every page. You can delete wp-content/advanced-cache.php and reload the plugin settings page or edit wp-config.php and look for WPCACHEHOME and make sure it points at the wp-super-cache folder. This will normally be wp-content/plugins/wp-super-cache/ but you’ll likely need the full path to that file (so it’s easier to let the settings page fix it). If it is not correct the caching engine will not load. If your server is running into trouble because of the number of semaphores used by the plugin it’s because your users are using file locking which is not recommended (but is needed by a small number of users). You can globally disable file locking by defining the constant WPSC_DISABLE_LOCKING, or defining the constant WPSC_REMOVE_SEMAPHORE so that sem_remove() is called after every page is cached but that seems to cause problems for other processes requesting the same semaphore. Best to disable it. Set the variable $htaccess_path in wp-config.php or wp-cache-config.php to the path of your global .htaccess if the plugin is looking for that file in the wrong directory. This might happen if you have WordPress installed in an unusual way.