PageOptimizerPlugin

Optimize html markup, as well as js and css

Description

This plugin is used to clean up the html page foswiki renders by rewriting and/or removing code not required in html5. It also compresses all stylesheets and javascript code used in a page thus reducing the number of http requests that are normally required to load a page including all of its assets.

These changes only apply to output of type text/html, not to any other kind of output.

Rewrite of html markup

The following list of transformations is performed:

• all one-liner html comments are removed
• any markup following the closing </html> is removed
• sequences of <p></p><p></p>... are collapsed into one
• script blocks of type text/javascript don't need a type argument anymore as that's the default in html5
• style blocks of type text/css don't need a type argument anymore as that's the default in html5
• citations produced by foswiki's > at the beginning of a line are collapsed into one <div> block of type foswikiCite, or foswikiBlockQuote when there are multiple citation lines following
• <verbatim> blocks contained in template comments are rewritten to look nicer for better readability of view templates coded in topics

Combining and compressing stylesheets and javascript

PageOptimizerPlugin is reading all css and js files loaded into a page and combines them into one each. Only stylesheets for media="all" are processed. Only scripts of type text/javascript are processed. All css files are parsed and rewritten so that contained @import() and url() statements are working as expected.

The combined css (js) files are cached and reused by pages that have the same profile of assets loaded into the page. Or expressed the other way around: each page that differs in the set of assets will get its own combined stylesheet (javascript).

PageOptimizerPlugin is able to gather statistics about how often specific css (js) files have been used while combining them with others. This feature is switched off by default but can be enabled using the {GatherStatistics} switch in configure. Once statistics are enabled, the plugin will record css and js use. Results can be printed out using the statistics REST handler. For now, this is a rather crude statistic how often css (js) file have been used per pages visited. E.g. a value of 100% means: this asset has been used on all pages, whereas lower values indicate a decreasing frequency of those files being used.

All css and js files will be cached in plain text as well as encoded gzip compressed for browsers supporting on-the-fly decompression of js and css files.

The cache of stylesheets and javascript files can be refreshed manually by using the refresh url parameter:

• https://wiki.alexander-weimer.com/bin/view/System/PageOptimizerPlugin?refresh=on (or cache): refresh the css and js cache for the current page
• https://wiki.alexander-weimer.com/bin/view/System/PageOptimizerPlugin?refresh=css : refresh the css files of the current page
• https://wiki.alexander-weimer.com/bin/view/System/PageOptimizerPlugin?refresh=js : refresh the js files of the current page
• https://wiki.alexander-weimer.com/bin/view/System/PageOptimizerPlugin?refresh=all : purge the complete cache

Installation Instructions

You do not need to install anything in the browser to use this extension. The following instructions are for the administrator who installs the extension on the server.

Open configure, and open the "Extensions" section. "Extensions Operation and Maintenance" Tab → "Install, Update or Remove extensions" Tab. Click the "Search for Extensions" button. Enter part of the extension name or description and press search. Select the desired extension(s) and click install. If an extension is already installed, it will not show up in the search results.

You can also install from the shell by running the extension installer as the web server user: (Be sure to run as the webserver user, not as root!)

cd /path/to/foswiki
perl tools/extension_installer <NameOfExtension> install

If you have any problems, or if the extension isn't available in configure, then you can still install manually from the command-line. See https://foswiki.org/Support/ManuallyInstallingExtensions for more help.

Dependencies

Name	Version	Description
URI	1.54>=	Required.

Change History

25 Sep 2017:	added http/2 push headers
09 Sep 2016:	improved cache handling, i.e. added a rest handler to purge the cache occasionally
13 Jun 2016:	fixed compatibility with AngularPlugin/AngularSkin; performance improvements
23 Feb 2015:	remove some bogus non-macros if left over, such as REVISIONS, REVTITLE, REVARG, QUERYPARAMSTRING
04 Apr 2014:	flag rest handlers that don't require authentication
30 May 2013:	fixed handling if IE conditional comments; no js or css optimization by default, only html cleanup
07 May 2012:	added feature to make at least some <p>s real paragraphs for improved typographics
02 Apr 2012:	added {ExcludeJavaScript} and {ExcludeCss} feature to specify files not to be processed by the asset optimizer
26 Mar 2012:	added flags to turn on/off specific optimizations
20 Mar 2012:	added statistics module
19 Mar 2012:	initial checkin