7 ms·
Show HN: I wrote a script to turn a webpage into bitmap HTML. (Caution: huge)
- slouch 16y agothis 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.
- zbanks 16y agoWhy didn't we think of doing this before we had Canvas! ...oh that's why.
- EGreg 16y agohow?
- citricsquid 16y agoI 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 16y agoI thought he said he does it with javascript!
- citricsquid 16y agoI just looked via Twitter and found he has posted it on Github, seems I was right: https://github.com/elliottkember/img2html.rb https://github.com/elliottkember/img2html.rb
- flawawa2 16y agoIf 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. ;-)
- StavrosK 16y agoOh, the humanity. Why would you do this (apart from "Because I can")?
- viraptor 16y agoFinally a pixel-perfect display on any browser! With no-license font embedding.
- aj700 16y agoI 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 16y agoWolfram Alpha does this. I think it helps with writing formulae.
- deleted 16y ago[deleted]
- stcredzero 16y agoPerhaps 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 16y agoCalculate `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 16y agoCan't the same hash mean different data?
- viraptor 16y agoWell, 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.
- stcredzero 16y agoThe problem with this, is that the random bytes in one iteration of the loop might be closer to the page than the next iteration, so there would be reverse progress in that instance. This entry would be disqualified.
- meric 16y agopage_bytes = bytes(size_of(bytes_of(page))) do page_bytes += 1 while (page_bytes != bytes_of(page)) print page
- wzdd 16y agoBonus points for apparently using RLE for same-colour runs of pixels. :)
- elliottkember 16y agoThanks! I did it without first, but it was way too big and crashed the browser.
- ronnier 16y agoSource https://github.com/elliottkember/img2html.rb https://github.com/elliottkember/img2html.rb
- proexploit 16y agoThen turn it back into HTML with an experiment of mine: https://github.com/andershaig/img-con 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 16y agoUh - that's exactly what this script does!
- proexploit 16y agoYou'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 16y agoProbably mostly the Gzip - the code is very repetitive. The RLE helps too.
- roadnottaken 16y agoThis 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. :)
- jcapote 16y agoNice! this reminds of a script I wrote that turned images into svg: https://gist.github.com/761332 https://gist.github.com/761332
- darrenkopp 16y agoand all of the sudden, the new years clock done in sql seems useful. hope you don't go over your bandwidth quota ;)
- ph0rque 16y agoI think it's to early to call this a startup... you need to think about your potential revenue sources. ;~)
- biot 16y agoBandwidth deals? :)
- emilsedgh 16y agoAnd you'd be amazed to know that khtml (KDE's rendering engine, used by Konqueror) renders it instantly!
- aj700 16y agobasically doesn't get rendered at all in ie9. big surprise.
- templaedhel 16y agoNow if only links worked. Then you would have created a modern image mapping service. I like it.