computationclub/computationclub.github.io — pull request #30 by tomstuart (2014-10-25 16:42:28+00:00)
Title: Draw 1 cell per pixel, then scale canvas up

In principle this is a much more sensible way of doing things, since it eliminates the arithmetic around `cellSize` and probably makes the scrolling less CPU-intensive (#10) because we’re not copying as much image data. This technique might also make it easier to customise the page for mobile devices (#29).

In practice it’s **not ready** because scaling the `` with CSS makes it blurry — browsers use [bilinear interpolation](http://en.wikipedia.org/wiki/Bilinear_filtering) or similar to resample scaled images, rather than causing pixelation with [nearest-neighbour](http://en.wikipedia.org/wiki/Nearest-neighbor_interpolation), but we *want* pixelation in this case. I’ve tried various fixes (e.g. CSS 3’s [`image-rendering` property](https://developer.mozilla.org/en-US/docs/Web/CSS/image-rendering)) but none of them seem to work, at least in Chrome.

Can anyone make this work?