

Show HN: I wrote a script to turn a webpage into bitmap HTML. (Caution: huge) - elliottkember
http://elliottkember.com/awesome/hn.html

======
stcredzero
Perhaps this could be a good start for another coding contest: The most
inefficient webpage.

The object: take a copy of the Google search page and represent it in the most
inefficient, bloated way possible. There would be two divisions: time-bloat
and space-bloat.

Rules: Every piece of code must be involved in displaying something visibly on
the page. Every statement in the Javascript must be making forward progress
toward displaying the page.

The functionality of the page must be exactly the same as the original.

Any other rules?

(There wouldn't be any loading and waiting on external resources, of course.)

~~~
viraptor
Calculate `h=SHA256(original_page)` and `n=len(original_page)`.

    
    
        do
          page = gen_random_bytes(n)
        while (h != SHA256(page))
        print page
    

It can be even generated client-side!

~~~
wwortiz
Can't the same hash mean different data?

~~~
viraptor
Well, sure. But if you add another check for likelihood that `page` is fairly-
correct html in utf8, there should be around one correct result really :) If
you get 2, the other one is probably a <form> you can use to sell your soul to
satan - do not hit submit if you get it.

------
roadnottaken
This is cool, but when I first clicked it I thought it was transforming my
current webpage into HTML/bitmap somehow. I was amazed. Then I realized it's a
statically generated page. If you could make this into a bookmarklet that
transformed the current page, then I'd be REALLY impressed. :)

------
proexploit
Then turn it back into HTML with an experiment of mine:
<https://github.com/andershaig/img-con> \- It takes an image, writes a span
with a background-color for each pixel. Turns a 100x100 image into a 7 MB HTML
file.

~~~
elliottkember
Uh - that's exactly what this script does!

~~~
proexploit
You're right and I should have paid more attention. I had thought you were
generating just the image from a web page. Having actually worked on something
similar, I can say I'm very very impressed with the load time.

~~~
elliottkember
Probably mostly the Gzip - the code is very repetitive. The RLE helps too.

------
wzdd
Bonus points for apparently using RLE for same-colour runs of pixels. :)

~~~
elliottkember
Thanks! I did it without first, but it was way too big and crashed the
browser.

------
StavrosK
Oh, the humanity. Why would you do this (apart from "Because I can")?

~~~
viraptor
Finally a pixel-perfect display on any browser! With no-license font
embedding.

~~~
aj700
I laughed.

But, there's another way - use a damn scripted gif or png</obvious>

...or for monochrome pages, is an xbm smaller?

update: oh yeah, i forgot, xbm files are C, though I suppose you could meta
script them with more C.

people who really dont want their text stolen are going to see the massive
bandwidth we have now and start just using images. protects it from anything
but ocr.

~~~
elliottkember
Wolfram Alpha does this. I think it helps with writing formulae.

------
ronnier
Source <https://github.com/elliottkember/img2html.rb>

------
darrenkopp
and all of the sudden, the new years clock done in sql seems useful.

hope you don't go over your bandwidth quota ;)

------
ph0rque
I think it's to early to call this a startup... you need to think about your
potential revenue sources. ;~)

~~~
biot
Bandwidth deals? :)

------
flawawa2
If you are just looking to make a self-contained file that has the page as
image, I would suggest you simply embed the image as base64.

I made a bitmap -> <table> once, that was pure hell like this. ;-)

------
zbanks
Why didn't we think of doing this before we had Canvas!

...oh that's why.

------
jcapote
Nice! this reminds of a script I wrote that turned images into svg:
<https://gist.github.com/761332>

------
EGreg
how?

~~~
citricsquid
I would assume he takes a screenshot of the page (xbrow.se is one utility for
it) and then picks the colour from each point and displays it... quite simple
to do, _why_ is probably a better question :p

~~~
EGreg
I thought he said he does it with javascript!

~~~
citricsquid
I just looked via Twitter and found he has posted it on Github, seems I was
right: <https://github.com/elliottkember/img2html.rb>

------
emilsedgh
And you'd be amazed to know that khtml (KDE's rendering engine, used by
Konqueror) renders it instantly!

------
templaedhel
Now if only links worked. Then you would have created a modern image mapping
service. I like it.

------
slouch
this week, i've been converting HTML output into PNG images. i used the
preview feature of an HTML to PDF dll we have lying around.

------
aj700
basically doesn't get rendered at all in ie9. big surprise.

