inliner-terser
Utility to inline images, CSS and JavaScript for a web page - useful for mobile sites
Last updated 5 months ago by ryank02 .
MIT · Repository · Bugs · Original npm · Tarball · package.json
$ cnpm install inliner-terser 
SYNC missed versions from official npm registry.

Inliner Terser

Turns your web page to a single HTML file with everything inlined - perfect for appcache manifests on mobile devices that you want to reduce those http requests.

What it does

  • Get a list of all the assets required to drive the page: CSS, JavaScript, images, videos and images used in CSS
  • Minify JavaScript (via terser)
  • Strips white from CSS
  • Base64 encode images and videos
  • Puts everything back together as a single HTML file with a simplfied doctype

Installation

Install the inliner-terser utility via npm:

$ npm i -g inliner-terser

Usage

If you have either installed via npm or put the inliner-terser bin directory in your path, then you can use inliner-terser via the command line as per:

inliner-terser http://remysharp.com

This will output the inlined markup with default options. You can see more options on how to disable compression or how not to base64 encode images using the help:

inliner-terser --help

To use inliner-terser inside your own script (untested, let me know if something is wrong):

var Inliner = require('inliner-terser');

new Inliner('http://remysharp.com', function (error, html) {
  // compressed and inlined HTML page
  console.log(html);
});

Or:

var inliner = new Inliner('http://remysharp.com');

inliner.on('progress', function (event) {
  console.error(event);
}).on('end', function (html) {
  // compressed and inlined HTML page
  console.log(html);
});

Once you've inlined the crap out of the page, you can optionally configure a service worker to add advanced caching and offline functionality.

Support

  • Collapses all white space in HTML (except inside <pre> elements)
  • Strips all HTML comments
  • Pulls JavaScript and CSS inline to HTML
  • Compresses JavaScript via terser (if not compressed already)
  • Converts all images and videos to based64 data urls, inline images, video poster images and CSS images
  • Imports all @import rules from CSS (recusively)
  • Applies media query rules (for print, tv, etc media types)
  • Leaves conditional comments in place
  • If JavaScript can't be imported (or is Google Analytics), source is not put inline

Limitations / Caveats

  • Whitespace compression might get a little heavy handed - all whitespace is collapsed from n spaces to 1 space.

Current Tags

  • 1.13.8                                ...           latest (5 months ago)

7 Versions

  • 1.13.8                                ...           5 months ago
  • 1.13.7                                ...           5 months ago
  • 1.13.6                                ...           5 months ago
  • 1.13.5                                ...           5 months ago
  • 1.13.4                                ...           5 months ago
  • 1.13.3                                ...           5 months ago
  • 1.13.1                                ...           5 months ago
Maintainers (1)
Downloads
Today 0
This Week 0
This Month 7
Last Day 0
Last Week 7
Last Month 0
Dependencies (19)
Dev Dependencies (7)
Dependents (0)
None

Copyright 2014 - 2016 © taobao.org |