Version: 29-Feb-2012
Author: Julian Viereck <jviereck (dot) dev (at) googlemail (dot) com>
tl;dr: Printing on the web is very limited. There is CSS3 Paged Media "Last Call" spec, that improves things, but has not been adopted by browsers yet. How about creating a new "WebPrintAPI" that does not use the DOM but is more like a simple canvas API? Would such a simple API be helpful for your printing needs on the web, or is it just suitable for very special use cases like PDF.JS?
This document is intended to sum up the current state of printing using the open web platform. It should serve as a foundation for discussion on how to get proper printing support added to the PDF.JS project (adding printing support is tracked here).
- control of target print size: Should the printing end up on a "letter" or an "A4" page?
- control page orientation
- control pixel precise printing output / way to determine which content to be printed on which page
- control over the entire page layout - e.g. no header/footer added by the browser
- memory efficient
- cancelable printing: creating print jobs for many pages should not block the UI / print action cancelable by the user
- control print output size (A4/Letter): Not possible
- control page orientation: Chrome - Yes, Firefox - No
- control pixel precise printing output: not possible; breaks pages due to "best" fit (however, there is a way to force a break before/after an element)
- control margin: Chrome - Yes, Firefox - No
- control heading: Chrome -
margin: 0, Firefoxmargin: 0doesn't work - memory efficient: requires DOM (SVG) for vector/scaleable output -> need to create DOM nodes + store them in the DOM. For printing drawings this is not really memory efficient (use case for PDF.JS).
- cancelable printing: possible by adding small chunks to the DOM
During my research I came across the CSS3 Module: Paged Media proposal (status: "Last Call" - Editor's Draft 20 February 2012). This proposal seems to implement a lot of the missing CSS stuff to match the requirements pointed out at the beginning.
Browser Support Gecko:
- Bug 286443 - CSS3 Paged Media: No sight of progress in years
- Bug 115199 - @page in CSS2 not implemented: Has patch, review comments from 2011-12-06.
Sum up: There is no support CSS3 Paged Media in Firefox yet and it doesn't seem like work has started on it yet.
Browser Support WebKit:
- (Bug 39735 - Implement CSS Paged Media Module Level3's Page Breaks (master bug)[https://bugs.webkit.org/show_bug.cgi?id=39735]: Has patch from 2011-05-24
There is no good printing support on Google Docs using Firefox. Chrome performs better. Google Docs has no good support for Firefox/Chrome says nothing, but it might be an indication that printing is a very hard/impossible to do using open web technologies.
In my opinion there are two ways:
-
Improve CSS printing support available in the browser
-
Come up with something "new"
Thoughts about 1): The spec for the CSS3 Paged Media looks quite huge to me. Getting it implemented will take quite some effort and time. Also, although the spec just entered "Last Call" status, it still might take some time until it's finalized...
Thoughts about 2): Therefore, I was wondering if it makes sense to create a new API from scratch. What I have in mind is something that looks more like the current canvas API, maybe something like the PDFKit Library. Such an API would give 100% control over the print layout. However, on the downside, everything needs to get drawn and aligned "by hand", compared to using the DOM.
Would such a simple API be helpful for your printing needs on the web, or is it just suitable for very special use case like PDF.JS?