jviereck/gist:1953505

## gistfile1.md

      
    Raw
  

              gistfile1.md
            
          
    Version: 01-Mar-2012 

Author: Julian Viereck <jviereck (dot) dev (at) googlemail (dot) com>
About Printing On The Web

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?
Please leave a comment - I would really like to get your feedback on this!
About this document

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).
Requirements for proper printing support:


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

CSS - Status Quo


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, Firefox margin: 0 doesn'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

Paged Media

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

Experience with Google Docs:

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.
How to add proper printing support to the browser?

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?