10 ms·

Itty Bitty: Sites contained within their own links

420 points by Pulcinella 8y ago

adamdrake 8y ago
This is neat! I did something similar with https://tinysite.adamdrake.com https://tinysite.adamdrake.com where I have a website that fits into a single ipv4 datagram (at least it did when I was using my own HTTP server). More details here: https://adamdrake.com/the-biggest-smallest-website.html https://adamdrake.com/the-biggest-smallest-website.html
- duxup 8y ago
  Someone has to combat our wasteful packet usage!
- ReverseCold 8y ago
  It's 9XX bytes, is the extra from TLS?
  - adamdrake 8y ago
    When I moved it to AWS Lambda there was some size introduced from TLS and also from some headers that AWS API Gateway adds which seem, unfortunately, impossible to easily drop (e.g., if you make the headers empty in the response, APIGW will copy them into another header and still add its own). I might pull that service off of AWS APIGW/Lambda, in which case the size as an artifact of AGIGW would disappear again.
saagarjha 8y ago
I wonder how large a website using this scheme can practically be to work on most browsers. I know of at least one browser that limited URLs to 100 characters, but it's almost 30 years old…
- lainga 8y ago
  While most sites/apps support about 2000 bytes (2KB), some can handle more... Twitter and Slack, for example, allow 4000 bytes in a link. 4000 bytes is enough to apparently encode the full text of Poe's The Raven. https://twitter.com/edgar_the_poe/status/1003524516440563712 https://twitter.com/edgar_the_poe/status/1003524516440563712
  - kovek 8y ago
    It's now hosted on tinyurl: https://tinyurl.com/yafprdyo https://tinyurl.com/yafprdyo
  - yourad_io 8y ago
    The HN frontpage bitty that I posted in another comment is around 8K. [1] I also did a reddit one that works on my browsers[2] (copy/paste URL into new tab) at 26K (!). Which is apparently too much for HN. (Where's my free 5GB of storage for signing up?!) [1] https://news.ycombinator.com/item?id=17460932 https://news.ycombinator.com/item?id=17460932 [2] latest chrome, firefox on ubuntu
ummonk 8y ago
Don't use this for anything where you don't want cross-site-scripting vulnerabilities...
- chias 8y ago
  What would such a cross-site scripting vuln do? There isn't anything to steal. Moreover you wouldn't use this for anything where you aren't in control of where people get the links from, because as soon as someone else starts sharing it they can of course edit it too.
  - gbba 8y ago
    The trustworthiness of the domain name would effectively be stolen.
    - chias 8y ago
      I disagree. It's more similar to how you can "inject" your scripts into fiddle.jshell.net (via JSFiddle), googleusercontent.com (via Google Translate), etc. Have a look at https://fiddle.jshell.net/pvcL4mjh/1/show/light/ https://fiddle.jshell.net/pvcL4mjh/1/show/light/ Would you call that XSS / did I just steal JSFiddle's trustworthiness?
      - ummonk 8y ago
        That's a fair point.
Gaelan 8y ago
How does this compare with data URLs?
- sirsuki 8y ago
  It is smaller then data urls becausde the base HTML and javascript is provided by the itty.bitty server and not part of the data url. Only the inner content is encoded. So it is much smaller then a data url but requires a server to serve the initial decoding HTML page.
  - zeroimpl 8y ago
    The base HTML/javascript coming from the itty.bitty server does not make it smaller. As a matter of fact, it appears that the javascript provided by itty.bitty simply decompresses the URL fragment and then converts it into a data-URI and passes that to an iframe. So it is smaller than a data URI - but only because it is compressed.
waisbrot 8y ago
The link says > nothing is sent to–or stored on–this server but isn't it the case that the entire page is sent to bitty.site as part of the HTTP request?
- emp_ 8y ago
  The location.hash (#About...) is not sent to the server, which is where the content is rendered from.
- sirsuki 8y ago
  No, the page content is never sent to the server. all the server does is serve a static HTML page with some javascript. The javascript reads the compressed encoded data in the URL (the fragment which browsers never send to the server during a request) and then it decodes the data and writes the data to the current DOM. All content data is stored in the link itself and never seen by the itty.bitty server.
- brod 8y ago
  most http clients (browsers included) will omit url data after the # character, eg: `https://itty.bitty.site/#About/XQAAAAKrCQAAA...` https://itty.bitty.site/#About/XQAAAAKrCQAAA...` only sends `https://itty.bitty.site/` https://itty.bitty.site/` to the server.
chias 8y ago
This is neat! My second reaction (after "awesome!") was that I'd love for this to support some kind of optional identifier+hmac functionality. That's not necessary for when you are fully in control of where people get the links of course, but as soon as someone starts sharing links to "your" content they can by definition modify it as well. It'd be cool if I could share a page that says "by chias" and that can prove it. Then again, that would require itty-bitty to know that I exist, store my key somewhere, have some kind of auth system for me to log in and set my key... and now we're talking usernames, passwords, recovery email addresses, etc. etc., and I love the concept of services offered to people that explicitly don't do any of that. So third reaction is that it's great as-is :)
- ponyfleisch 8y ago
  you could just sign your content yourself using a publicly known key (e.g. keybase.io) Support for keys as a separate content "field" could be added to itty bitty i suppose?
the_d00d 8y ago
Great work and congrats on making it to the top of HN. I did something similar awhile back...I called it inception host :) https://github.com/jrhea/inception/blob/master/readme.md https://github.com/jrhea/inception/blob/master/readme.md
Exuma 8y ago
https://itty.bitty.site/#/?XQAAAALfAAAAAAAAAAA0HSzgdXPvDK5AEi+dXR+Wp+VBBrHPUivt9QmuGfWQLaDzPoK1OINSJH8kY65bBkC0AlA1z6uxBe7XA66svOmlKtUCOjl0NqBjRKWb1K7gATXv4mdfvrbLH5qIBs5OFCEc6mlFqEjzlA+4tzQ2BFx2AqwbP6tWoWy6moAmT2l0YRTSngwnsoOTx/0QOUOV6SAmdcHylijJ+B6JLRuPYqaZVy83XDw61WKkzUCsVYmJ9n0ZxIUlcCjMfvDISU/0KPDsTkpWNaIRmjH4eef//j62gA== https://itty.bitty.site/#/?XQAAAALfAAAAAAAAAAA0HSzgdXPvDK5AE...
- TimTheTinker 8y ago
  Hi to you too :-)
- mchahn 8y ago
  I just get a page with the URL shown.
  - Exuma 8y ago
    your first clue
    - flyGuyOnTheSly 8y ago
      OK so you keep following the links (by copying and pasting into your address bar) and after about four links it says "oh hi ". Explain yourself! How did you do this?! Impressive!
      - sterlind 8y ago
        Simple! 0. Write oh hi :D, get link0 1. Paste link0, get link1 2. Paste link1, get link2 ... Encoding goes E(T), E(E(T)), etc. let K be the per-char encoding overhead, so E(T) = KT: complexity is O(K^N * T) where N is number of levels and T is length of text at level 0!
        flyGuyOnTheSly 8y ago
        D'oh! You're right! That IS simple!
shitloadofbooks 8y ago
This seems like an exceptionally bad idea. Even if if just used it for my blog, an attacker can craft a URL which renders obscene content ("Hitler did nothing wrong"), then scatter that link everywhere on the web and get it crawled. Eventually it shows up in searches, but it's definitely "on my domain." Furthermore, it's like running a public anonymous FTP, it'll just get used as a malware hosting tool as soon as it's found.
- wyldfire 8y ago
  Will crawlers do the js DOM rendering before the page is indexed?
  - danShumway 8y ago
    I think that Google does actually wait for Javascript to finish running. I don't think that it indexes URLs with their query params though. Maybe I'm wrong about that. Not sure why it would be a problem though even if it did - if you've ever hosted content on Instagram, Reddit, Facebook, Twitter, or, heck, even HackerNews, it seems like you'd have the exact same threat model.
- danShumway 8y ago
  I don't follow. I have a Twitter profile. If someone else shares racist stuff on their Twitter profile, is it "on my domain?" In any case, I'm skeptical that you would ever use this for a blog because the links are immutable. You'd have to either change your homepage every time you updated your blog, or you'd have to dynamically render your homepage in Javascript by querying another server - and if you're gonna do that, what's the point? Just host your own stuff then. What this gives you is a way to share static content where your entire app/page can be distributed in the url with extremely minimal server interaction. There's no risk of malware or vandalism because there's nothing actually being hosted - the URL is the data. When you share it with someone you know exactly what they're going to see when they click on it. I can think of a lot of uses I might have for this; even just minor things like sharing quick lists with family members. Updating the URL whenever I changed something would be annoying, but the benefits might outweigh the drawbacks. Edit: Are you talking about domain forwarding? I could see how that would be problematic. It didn't occur me because I'm not sure what the advantage would be. I don't think I've ever been in a situation where it was too cumbersome for me to host static content somewhere, but not too cumbersome for me to buy a domain and edit its config whenever I published content.
mkj 8y ago
Ah, it's by Nicholas Jitkoff, of mac Quicksilver fame. More elegant design. Edit: Oh, a bit more googling and he was lead designer for Material Design.
ehnto 8y ago
I do something similar in a bookmarklet to give myself a nice looking notepad. It's essentially a padded content editable div, with a prepopulated H1. This lets me print it out or save it as a document when needed. Which is never.
- carapace 8y ago
  Oh yeah! data:text/html,<html contenteditable></html> That's one of my favorite "stupid HTML tricks". I wonder who first figured it out? I can't find the original blog post (if it even was) and now it's a known thing: https://news.ycombinator.com/item?id=6005295 https://news.ycombinator.com/item?id=6005295 https://www.simonewebdesign.it/how-to-make-browser-editor-with-html5-contenteditable/ https://www.simonewebdesign.it/how-to-make-browser-editor-wi... etc...
cetra3 8y ago
Just be careful about XSS: https://itty.bitty.site/#/?XQAAAAIhAAAAAAAAAAAeHMhnVbtj2LI970NQdDTNrv4CLR793gw6k3+xZwRpB///91FAAA== https://itty.bitty.site/#/?XQAAAAIhAAAAAAAAAAAeHMhnVbtj2LI97...
- tantalor 8y ago
  Why
  - cetra3 8y ago
    If you're using this in your site as it stands, you are opening up XSS attacks as it does not appear to sanitise user input.
    - tantalor 8y ago
      Only if you do something silly like serve cookies on that domain
      - comesee 8y ago
        I think this is ignoring the content of his warning and is a tautology. "it's only opens up an attack if you allow the attack vector"
shakna 8y ago
So from Content Lengths [0]... You've tested on Chrome, and IE, but not Firefox? [0] https://itty.bitty.site/#Content_Lengths/XQAAAAIXAwAAAAAAAAAeHMqHyTY4PyKmqfkwr6ooCXSIMxPQ7ojYR153HqZD3W+keVdvwyoyd+luwncAksyBpBYltNr1Oj+0nFtw4rO71K7JRYBTu1/STbYi7TdKa6fx163w7+2NwPfmhoOPwFp2gWV4ZXeA0rB2gi0U/f9/E2cOaRXxIZgD6U7i6ie89XizK8ZD8Fq+/mkO2WT2uJMvs2IVmwdqcjmEFhkmeDr9BaUhampEh70WRk2sC97NHMFXHGhvU8nA5nGjHVrGCTMai5A+JsPaT5GVV8z6vEm8YhzZD8pHG1qLCbyRSpjFAVw8JVmePH6EIs0Oaa14O3tpLFoWCAEJ2uDF4Nyq3gOAMQGhSn5vwAFE2Y7iaghGFqMt4jsAnig63UM/dklujh27iHRdCMUdPttYxqZDghrhxUM/ge+Tlln5hcbX4Z5BIbtRXQW8R2Zjf8t/46VOvuURbM0yu3JmIbMLZxPcv/N1z0wAB8FWVKblgtwaPl5E1MfmdoITh5g4JL3LW2+EWFQkJOBvITY/PO6EvWgWyxD9Ugi6X8SFa+VHexlxpQTDJ+FUja6Yn/W1k2Zi7ypJLnPvCmkCmGiEMzuIzNPF/ygWcwA= https://itty.bitty.site/#Content_Lengths/XQAAAAIXAwAAAAAAAAA...
- sp332 8y ago
  Firefox's is very useful for testing image data URIs. You can paste the whole thing into the address bar and it will render the image.
Pica_soO 8y ago
Nice one. https://boutell.com/newfaq/misc/urllength.html https://boutell.com/newfaq/misc/urllength.html JS-Fat-site shaming by link.
- djsumdog 8y ago
  huh. I know a lot of early buffer overflows came via the URL back in the early 2000s and early IE days. I can understand why there shouldn't be a theoretical limit today, at least until your machine would run out of resources. 32GB url anyone?
ryanpetrich 8y ago
A quine: https://itty.bitty.site/#/?XQAAAAIPAQAAAAAAAAAeGEPDwwAoaS2SjfmzbgJNBE+G+K4XOI91HV7SWCkxcfvhG0ogKSeNhUBdXvB6YB8z730BjbgRiydXuBgVTKkUl8fX5BZQGkYaqyDbdXWLJME3xFVLOuG1u/u73lcdjsRW02LnLnQRYi/2ZaPht09tMM/UgfxPyxisKUhh6b3Wz8o+jwEeQOYLSErM/qwMY9FgYA6o0WUQ8BBoN07NM08ltpAvbzrghducIPKuZuw0exavcBomDwk6kBr57ok8cKR3KDFsL/1SnhNGyG1fqGRw3/52oh0= https://itty.bitty.site/#/?XQAAAAIPAQAAAAAAAAAeGEPDwwAoaS2Sj...
- ponyfleisch 8y ago
  nice! how did you do it?
  - ryanpetrich 8y ago
    As others have pointed out, it's not quite a quine and just some silly JavaScript that reads out its source from the DOM and feeds it back into a copy of Itty Bitty's URL generation algorithm.
- erdemozg 8y ago
  It's like an image containing its own SHA2 hash. How is it possible?
  - saurik 8y ago
    A quine is more similar to (but not quite the same as) an uncompressed image containing a QR code with a compressed copy of the same image, which has its own challenges; but like, a cryptographic hash function (such as SHA2) is designed explicitly to make this hard... if you had chosen a simple checksum instead it would be trivial to create an image containing the text of a checksum of the image: a compression function (particularly a tiny custom one designed for this one time use, that removes barely any entropy at all) is predictable enough to be manipulated. (edit: I hadn't looked at this one, though; but now that I see its code, apparently it is just cheating by accessing its own code via the DOM; it doesn't need to do that, and it doesn't even really feel like a "quine" to me given this implementation.)
  - lurenjia 8y ago
JAdamMoore 8y ago
This is old news from 2011. https://news.ycombinator.com/item?id=2464213 https://news.ycombinator.com/item?id=2464213 It was done better by David Chambers https://github.com/hashify/hashify.me https://github.com/hashify/hashify.me And you can use it here: http://hashify.me/IyBUaXRsZQ== http://hashify.me/IyBUaXRsZQ==
- recursor 8y ago
  That's cool, I hadn't come across hashify before, but I'm not sure about "better" overall - depends how you're using it... ...itsy bitsy site's demo page gives a couple of nice additions * I use markdown a Lot, but the inclusion of codepen.io makes it simple to compose richer docs, including svg's in a page etc. (I haven't read the hashify code - I'm assuming it does support full HTML, not just MD, but the demo doesn't make that clear) * QR code link - is just using a 3rd party zXing tool, but, nice touch for the demo * Compression - hashify URLs seem to be longer than the content (that might mean lower effective limits on content lent), relying on 3rd party lookups for shortening, meaning accessingv the content offline looks harder to achieve (afaict itty bitty just needs the JS to decode the url)
yourad_io 8y ago
Try this: CTRL+A CTRL+C on a simple-ish site, then paste on itty bitty. Works surprisingly well - with the exception of images not rendering. Super quick static mirroring. I like. Edit: tabular format is preserved as well - copy paste from Excel :ok_hand: Edit: Bookmarked! I'm going to use this for sure. Idea: A javascript bookmarklet of some sort may be nice here. Maybe "create itty.bitty site from current selection" or "... from entire page"?
- yourad_io 8y ago
  HN: https://itty.bitty.site/#/?XQAAAAIj+AAAAAAAAAAeHQgmOm3if2bOhHr5aQJnmLjucBSrgZMEr9C1MVvQzYKQ6yR0Hn5b8UkkprMZ+jdfE90BN5zeeqLGxB1HtmYu2cfdOFlIvC8aXYpl4bgkYvgkUKmCG0DZOjyjbTJvktAQxcZqVmAyFs0V/tux+KKFAKDWMuvGF7/k87nBMcvuJCK6W1HXV8v7LbnWLvYET8rI2zD7XiaNsLjliM3RbGBjI5KG1Sw3uL8gOEElfgXxH/4y9Otd/fb95u59M4SB3fThdsJ35Go//qPM76dsNr8Gq0P33ZzmxeanogphEAPzXJiAZXhu+yaoWsbL+ZlG0SMROJ5XZhisaP2J2mXMbpAl03EIjdnoiwU2a9EXUYmBfVNxFO0lrBFqespuWws3mekzFagraHA4BiohxmFGy2OlgVPo5QYWcD6qQVIswph86xF/gT29uOFhkRPloWD/MvZ6FfEdSGQFLP7nbos/gIeeI1wCkHPTscFMYA7DYwhoH6Gj0FuEyZX79ltvZcZqZKDKVNOrcAfk51IPoXjev7qBcjQNIUZIjPGTM4fkvefdphPq5k71CaAs/2Gr1rLVEOQQqenvNXt1M7IXUQkanq+jWMhBRWArX2Y08WYAG2+WBBSuO2f7YplkszdSIi8OqJliHwJ21zPdUbW8tXzV9SVHNtVCD4UOv9qrr+mUdXbtPC0vfWbp8hEQxxZDhSKDA6McTrHliwrOFAa3p1W0LaigcZGDWOeqKS6sTdeYHLybANXWb/SrQQugbKWGY2JhcFl/eepVTbCkwhWFpG/MVIopdms8wkN2wN03KetIWwSrrf2bfsaGxH533t7zuUZHhOonjE8WLr2WxxbCEy+RNYw9csfIx/qC4fqV+txhZ1cCE26QF+oiPONFUw3BL9Qjd9NHSuItZfuS+fV8VfOPkGXOcuPqEzamOWWvT67DjBMg6mGTFiDi3UmI7DImHnMZCzb03T99w2xYmKn00TkP4eb/zK2ozeub+KGhJVcI/Dm5JF6THdpxK1bSiqA3gG4/uM+XGl8XHSjXZ1pNN3wBna+s5+hyzYCgISvFAH1X52q8kOEG2+uS+G7lxjviFHs92FhuaBZcaKG4iycqdHUliaHbuQqdkcxq7J6eBKGaKKmv63RtkfTPO2w2rb9ZgZQg1TZyXjyhXQV/LWbD6HEfWYs2qY9B+TBWea9/v3vVtB95TTzYfRZt/oGh+8ymnzr779ATt9IPhjrB9lgagiECfaugQVVM5Lj+YxFzOJWGI+mTPfLR0McgRSWeabcknLDmnkzDu/Ijq3BzQFkTAWwaZTirIAW6riyWz+EYhB+4KJrkLNwDVy47tkRWlET3CPH1gnsVR2BOTEUrUhJsuXTlWUdAjmMGlaJwEisB1j3idclh0ZdziVBRHEKW0e1zjjaI4+sPaT1XFUZ2qCs8Yr+GRJmmFX/VF0oiogSHJVy0lY1n/+JSw5VejR+z1gOyp0aNiOBrtdkIOPTZY96NlNHmDoCjoalYtnLDky2H4pubonlLY2A0aQKUlLZvY4wJYMQ7geI2jIOdJc2CpZvXOZpbwmFxnclAn+mZHY+oSCwKzi1tLUsvdxj5MstYdeVuJzwwZZWb0Sd3F0Pv+s/UwkVeYUyB30jKDPTqL0SnERsHJnsPTe86hEUHoOGOREWFID+OsvdfPtPq8/IPmDN09JZa9PhVAdIR01kOASfkK1yUAehyVKfdaT2ZbxhQm0HcLlnHDikx+DwGHqO08IiQYK3P4haE9A2Zg2NhTtzXahs9+xe81t/AUiJIFvoHqPF4ljxHqdNB7PfT60GfMWngngSWOmx1zsLAolc0M7jvXPbIB90Khcua39LGcgCKS7rXV3FfOKhbVDtrTAAk99VFfIh5yI5hWUBIsCle4P5lb3tboXAEGLRfSHQRixki1RhnssSO242KOfKQ+JleCEPA9gXN0Lke8yKwq01OJh4v6Utxah1cgLh6pPMuiq2kQxUo8JutrKtz+U9ktVr/youYswhoMbcHQ64C+aHusr8og6ETYGElYCz8V+q9sSRfPGm7LCNf/rpIuLaegwq9x9aostB8rfz09/5psKobhQOMStYui9LR3fpT7UWJeyhYRM28fZRgzaNQJg/fK+pgSxYKxraQbhsFBDQwbQjZO6JvOmeo///qrPfetxVhfk5kvmVJTD0L4vYt/bfOY0FuOi9FusIN1rbC4QX6cQzA7EvoWUsVEPM9q6OmTvJBeBIMoITxYIxjp6oT8RocYMN5UGVExBJN9gNx27w//OTt/8x+64WViXLHO+92Xe8GkjZ+12KZbIVYCRJIdXbeeVnPREdnESPwkjaZ7674w1OhM+naujMqv7iVyDp/0IiF3sffCupCPPogKYL4iG+qeJFKK7yFfOriR+LMwa01aHtwnzOXw7XQai9GBwHKIGGrQ+tIUt7fZoWKcapaN4kpnkKDo/HoxFoHN6DqmgPfmEE3D9/t9Zer3iyYijPbWc3B9a0BYR+S88VuT9LJ6+7G2+IReL1iCFeppivnbIsIXpKoBZMPAqgjBmyADoiUq9AhZrPxGqOzpnqariRhvsSyP5Ld7T+IIxsegFjl3jAX/9YGHIpuC2etw0onC7+3h+SzfzRTg2qtvruxBcaW10zc+qoX+P0leFp/cJmnr01QQTGbzS2hFzf/TtFn6aT06KgpWIEU2V4aAujQWPemu5kUgtGXSdJwGVit7b/am307KfjhqpZSOMrSpLqZXi+lOrtgC8CslWxMP3oznhT8JJZhP9Q5U+f8dKn2O2CGbei/DGPJ+18HJn9ndU0WFW0lXwHmif3njiV2gHvwXO9S8YkBnGS8X1iN+4M99VCzZd+g4OVS4UF/s/o5lJXsJAwFJkxUrCmQ7lcu7WwYReederN7TVqcaRC9HUwrIr/C/Qvk6InJclGvy7nYqek3/1VyIY8L+0hzKXmq0uF0L+fFTDigNyy8eX50kDN8UrkmLy3v449bcSpZltEXrx0Qiu9MI0xit6JQxOgjT06q4AVXhFTypf4u3lMo4I6KQPeGVdYlP/3jg7XCg6xnHa5+/ub2VtIJq6kd/xBgl18b3EVPCgXfFb9IMIGPGzmUztczjtXNkCK0z4y5lq77+ETFdtwrVynp60RJljpRXMnDU9ktj7jDRj3/jNGz7BTPARxPOp4kfxFE1s7oVx6O1gouLvk56tHNmB+6s0L/NihScpcYrfH6u4LSb5aAs5XCiDqZKN5q3AlP3ccvmb9KvawwWZ7EhUSvHmrnMTJd3bBWKIZJx9WxCJf6QlETJed5sKNFKSsndIcCDtoSmrLIw9JzjC1VC8T471+hN42dYk0Ji+fEmjl5azneU31Jp9aB0omgizQ/lyNZAuUK+QPUnuJu9XlAMwLTA7L2Lkfr6XfUI2SvSbZKNbeSWzaDY61bRSLrrtA4z2K54p7OZzCqdP5pFrYbmJSz9NDypTgI/nAfSqrkyK16XirtUIlwTR0/1RAMahIyqMHo6Gu/BmbFVs1GAQXa81QDTA8ovGfwu8J0Uk4hEFjpfyz6otya605qttzne53lxFloZqYdsfeAeqJ28BV8n0v3xAuNutFgNB/0hfHPlsmwGGNsuXqE5vqDYazxvNvpe9AE9CIKS4QPIDCm4iVYv5mfY+4luVk3qTZOJT/bLZaMhwFVlgfDziUhA5qh2J1kMtcP/m3NqfsfzOHUqvURFQBPnaIzisxxCXoyde31z53JokqE2S9h+orIWwJP6JRcJ0l+AtZSQxHPXw7bzcAEVzQTgq6oT8cFz7d6rPFZ6zH68xVV4GHIGvnbHwwhZa6Q6Bu7hcv1RRopUZp0LPZMZ9b4qKFytKUR0QbB5aOw563uhFA3LO+CECteI6CdLDz8MZLiNxOO0UBps1DFyd+Rylu7DX95oX78CB932Q0x1bgLpZMX7HFQuCZXeqOH8HLwIKF1YQSXZ7DIV5YOvU3Jmcgj+amAWnzkTIts+QhnymGLS3/5lawcV19Jvd4lzMef9/PZfZeJS+QasT1wV1MoPrfgZkJGYsnX2pbPFucg5p5cG7LxBGyyma/rgYkviFQtTHxmRXJJmuVBu8PSm5GyZZlCqYugwRg1oiU+9QPCNsRLKDJrIQz9+2q2zODMmN2SaKxFFydvZvukzWhzeKdAWptIZp67s0jO5Jclvzg1wIuSFoQ1A2V3aH0uYyk7jZ06JzpPDX6yq4yXdMpaXQH1kZc+qASW2ZDBwxrorClgwCYmUE3Zr6tciMQm4viaJF1zxzUlmCLID1KbvRbHZ3SDv+sw5FRVEWI8ELYnYU7a3gnyAUB32fK/1FeLjGUa0ia641QzrUZprffwF61H1wuUEMSTS7fEZbG82wAQ199eVrCdjJqa9LCgVKfSS4QxMVP2eU78OAwxiJZwEyV6OjyyLRMioOmLUierpav8Z1SJmJ+V3cU9eqsfuRmiTW9K7Emaa7OMiR6VYW1oc7C0cIbxV978EqaCfMXprN/Ywxc+nbjKH6RtkYiLYcOT4ahZsnNfiXGo+IQy34y8cz4xrQm3GlmXr6pbhqrawWT5hwwFfjEuLGmine1MpM3It6jVUB5qgPRusioqbUFTyvB2hQucVKHdw5nmGnSakJ7N97B0RlC9Y/sQpVhXp+IagJCIWAqO2VCgbpNqlTETOBG4JG3WruZjkpmIkOsaqn/C5ytHBxFLPM8HXaP0RS5q9HvMowBjzSrXu5q5SZ5cVjgZDln/uJmjgvM6A9dF+SAcrM1V0E36liH9PNyQKGCtJBtYJwNabPw7+VhVlF8yYub4xda+Sp2NmYAH8eGYLWV+aA8S2m5lucBq3BNSGiTXeNxi9sJA9vZsEZDLIQlNQkkWdqY3wBCvKM9Z0symx6Nl+i9d1PKvv8KRvokjOfbzBFwPU7QaNa+Lv1gouZJH0ZegfS9HoAH4ZkrXSB9M3BDGourKau2m09OVFH5pqNR8dCloL/KrwWyUnK//RtLWrMemPHtBJfbAnLyB0p7GUTisgO6LWkdAHUrC2u068avB9cXhP+83WtdbZ5n0Et9JV1jrqMDQ63ed/X+0v2dIp35dbURw/1iNAxTljIk8ccxph/XAzLs2EK63H74sfqqVA7zaAShIFTLyFkG/MElBmBJoBrXmS+EX/i4NCGk6dtVLggUGJTuLOhfsRXCDh5KHtPv1IGXhuq0KxQYjaz7MyfKHktX4lEQ+AMRx4NJjDJg2YxrZ16lf7jc1YLeYdvZmHrl2KwQ8wX3RvxF+je1XZZ6x7vasQxmJWr43aofCuZgDmeIWZj7io9xDQ+qlT0G8mNHFwuO4TYIkQMUc9IRWXr62m2JfTFvIyFieK3/2l4d9lw4OyPm1vzyJw6/I85l6fhdS2QE+2RFpgseqIhTfnhQgMgTyCoCKDOke3Ybgb7HbDwunwN8tzwFyUHryTGIJUh9Lmvz9+liIG8Ac+iz7Ao4NJUalBuUrR9Wd2ocyDtf72yjr6rZBX+acvOcSLJnsgG8edc1khofUz9j1sfCfxw/KpHg4F0Oh0q7rxZrhQpyjwf3zj61iXjzXbhLP8TLBAVplBArph+NZxY+9ugowPOrwa+NariLM+0TE+PYDMzm/MJd9fJLAJgmMb+lxAyaDRCEJ/LIIGoMknQSdVklVdUvN2ah84ILhX/YTsQpG5MUdPoWsMwOBhPbGsFAMaenl3a73fWo15+5h6Mik2L0Czp1ygu9q+RL9XClBBWvvLGBqhKPko46BpgX/BUAFTMqAXvcqTzgr2GUriwCzx/Ae3/vXu8C9RBzf6KlISympwmW9TBpFZ379xOq3MjRtUuiERPF2IixzyjvowrNUWYZu12rLUX0Jp7iL7DPgG6LlNyvoqGwn3nTibkBsfyMfCQSqbI12GWLLJDlNy7Ou3njjZVZgzmaIjKRviJQcx6yVh5zfttEI+UR0A8R44p6GdFheyB0hkUNtd8UHCDORPaZVbLgQ24GY5H0g/P3tOIgjV6KSnrBrVBLmlG8Y2uOtHgDbcW0sQinUWYWS8Mv/iAYB5wCZAoHbpbKQkbnrI4q9UKTnQbvFyCu6w1Un9yNYyCXKdtKBepYfAJ2DIM656qycF8ovo+fSA1U10CzvMqFt+jOsnLSt7FLlr6boleVige/4mCLxTLSJLfj3TFa3SQUAtKcSicAMJ7oSSALmkWtxnmSOL19tm3SHl8fhX6YjbIzaxz9XLUXkW9i4gOdqW0KfWv9d4dvs6xcESe93n3eEsCMuVKIJRT8dJKu9bLoKQg/2cIRcpWcG1zFRlyUODzvMPGpegZLWKTj8AwgsK4NVdZqr2KsRBcoFVyvS5pREhCwq/ysaRYFzXIWYurKMgRcO7HU0KqC9SVAKTJ/NX+fcepHb8pAQUMXMWpsUqsUydaNTP5JAZQiThuWUieTX6S0RiaVxuhh6QIahcTaQoe3IbOmVQPgZr7eQAEyNtVpIFvqYDn93iqSe+eqydvnopAaUQ7ctVoTNRlQbI/Vf8xVvFgsRitjSKPWuHkY7YndT5qFxj6KANdXKzaPLlRkG/Z8PokFWf05dIH3IC89XjCB8YaxlCrzjwoKtIQK6rykBcvLwsf8sR6yR7YspiitBoYv2sDtNMdzCFAYs0+xps3KmgoawMocDXSbK8P7nH6ikdZSyKGawhilv+S3T3zSWJIEFPqPmqx2CaiWIIfIv/RUyONUSz43MZlfadp66fK8ANYOfjUGEFIpGGwWoBTuAEucLQPGfr+WE1zSwC0ukEZPpOOrIDKfp2UQbZv4p0Sy5BfPyzi5dEz1LrGHKtnxoqyI+uo+wpkm9bZL4sgso+h1QKCxCPrvBLlSUsdeDz5O4cu9kC0q366hq3BpEEZN8Fcjdlb/wzPoR88cIiUVXJ17+1IrKHTo09Uaujh+SZJSkylxRgiQhtf11xc/I5cxQ0C3P6dn0Ok1klnQUBmrseHGUzjGH4YttEHwb+bRMZoWfBzkt3dT5lIr88jqWKR+HLGuWmNIiWDLwv7byFscpMWcPItilHkR+sunCxabJoQwMJBieMNk9PnQjCTRhDo/+w+7BmtAo+9pycwz8rrOkCFgcRPtS8gtS3TaNW2wStgCSx4FCTxMgnVvs/GyCT/nAYrDs3fCUNX+T+pWkg3YKHKxU/w6aYyQT/M1I2TERx2krXOKt+0y8toug5/Zv+DgQO+fN0eInZE7VLJxsnvw/KUEB+iea0tRXx7rR8d3Zqi4H6Uaa9/7WK+Lwh3Gg7pVR++VqWBiqu9b6ZBwjfLtWXtewxPShcadsT4kGF1CBAMUuXSVMemWkOTHaaiFr1/PRtA3KcwV6/h+DdPMji/NkvFaBLoOeF9P2o34fzXJkBfykrN7xHp56n/fQA4jwZLRtpqGLSgERrDEnj9+4VO562mAWi3BuQ7LO+XNxivWfo4YCfrvKchQwxwAYSqWOSkjwn5pAmHdYqyK54Oc2J32VZB0a2n18mi/6NcuLV6fDbT5HVmjRYOukiHsq1RTyBp93It4mUGlkY7M9WR42kovPRJi3bYSGSOTPrQeq3jW6Ukk0Y0Oz1Bz/6NaKOPDQ3a6+LT1DQt6TkUIgNm8D0FRZx18NaKatruYTcqZkY7OR8dtDV6gkZh4cRNzJZMgkIi9j+lqTX1rZuVSpVUtbpvrqABaXQo1Adh9S0MUt90RjJlrYV8TEraShA6sEXV86JuRdx4K5fYCjgkKWk1L76LI7wXdKmslQTML1lBNn+Arw1tuIwk2TdJ++VHQ/pP6VRniUqoEA8p5wZqjE1CMdY4s+rgTDjXow/iuQJ9mqZuZ1eqpqSTCnRHzblGkU6Gt/Wyrghqfugh7wLFEkzbpUzrOyjxbbbH4gQxJsgDiV1OFRrLbElbdV8KpOQhnj7OiV9Vd5UvbMOId37umHkj9spMplVv6j8jSTFz+XMll8BeUSo7XplKyu9CyUMaMCqagiUGBKKOkVqa8GxnKJui4TDHtw3M9Ps6GMClOifHbr7WYG2vvn0wh0qtvxOCVz1Ns8nOTIFre6r1GqFeVhLidfUstMYl5n27sxCQ9DvCXpG+UGR40LpNIys8TxAufAohN1+vtL9UO/xGwtaOntiMzpPEzBfGoEp1EJdwJy64ecPEjF/1hAW/8lvDJhYsAzXEN1lauHxdff4iUBrztI+q0zIGe+WRm46VA2lBXyv/JEu5WNjTDUB4Bh8xj13HcDyuAouBaO/pzi/6m49zMZi1ui5KYz3tPpOmes1lCfCtY+YVjvRuJjdAtJkZarUHnQiS0mCeju70KpsrrECcn4ClKtvCq/zUMpouj8FbP++WBS7Q== https://itty.bitty.site/#/?XQAAAAIj+AAAAAAAAAAeHQgmOm3if2bOh... Links are functioning BTW.
djsumdog 8y ago
It does require Javascript to render.
- Double_a_92 8y ago
  It does the decompressing and everything on client side. How would you do that without?
  - nateguchi 8y ago
    css
    - Double_a_92 8y ago
      A decompression algorithm in CSS? What?
qiqitori 8y ago
Another service that does the same thing: http://urlhosted.graphicore.de/ http://urlhosted.graphicore.de/ From http://urlhosted.graphicore.de/about.html http://urlhosted.graphicore.de/about.html: "urlHosted is an experimental web app that misuses the part after the "#" of a URL to store and read data."
pwaai 8y ago
very cool idea! https://itty.bitty.site/#/?XQAAAAIOAAAAAAAAAAAwnOxAdDhz11dLCTweFrUkFP/wyMAA https://itty.bitty.site/#/?XQAAAAIOAAAAAAAAAAAwnOxAdDhz11dLC...
trqx 8y ago
github page is missing instructions to inline the whole html/js/css package in a single file. Is it common knowledge?
finagle 8y ago
Cool hack aside, can anybody think of an actual use case for this?
- ddalex 8y ago
  Copy/paste content to my coworkers, like paste-bin. but without server-side storing on the paste site. It's amazing.
  - e12e 8y ago
    So rather than paste the text.. Paste the link, which they then open, to fetch the render-Middleware from this site, to render the text in the browser? Rather than just allowing the message app render the text in-line or as an attachement?
    - recursor 8y ago
      Hmmm. Could you not put an encryption layer into a derrivative of this for some generic PGP end to end encryption, without involving/trusting a centralised provider..?
      - e12e 8y ago
        You'd need to trust the (de) cryption code... So probably better off with cutting and pasting with gpg --armor...
- mstade 8y ago
  My mind immediately went to stuff like tickets. Can't say how many times I've gotten stuck having my ticket checked at a concert or on a train simply because there's no connectivity and the page is no longer in cache on my phone. If all the data is in the URI then it could work as an option for entirely static data. I'd say this is useful for almost anything that fits in a one page PDF.
  - Lxr 8y ago
helpme420 8y ago
Nice...
peterburkimsher 8y ago
I discovered data URIs in 2014, when trying to make an app that doesn't need to be distributed through an app store. They're fun. Nihilogic made a 14KB Mario clone that can be fit into a data URI. https://web.archive.org/web/20090310220414/http://blog.nihilogic.dk/2008/04/super-mario-in-14kb-javascript.html https://web.archive.org/web/20090310220414/http://blog.nihil... I also know about the way Cemetech's jsTified TI-83 emulator parses pictures to load a calculator ROM file (steganography). https://www.cemetech.net/projects/jstified/ https://www.cemetech.net/projects/jstified/ I put those two together, and imagined a new form of app distribution, which I call "Fondant". 1. Click a data URI bookmarklet. That is a bootloader, with the parser code for a picture. It presents a button to upload a picture. 2. Select a picture from the camera roll, which is the app. 3. To save, generate a picture and save that to the camera roll. This could be used to transfer other file types (e.g. a music player with a mixtape) over universally-supported photo sharing platforms. Unfortunately, the iPhone recompresses JPGs when clicking Save to Camera Roll, and the lost quality means the photo isn't parseable the next time. I did some experiments, and turned a blue/green checkerboard pattern into grey after 50 repeated Saves. I still think there's potential in the idea; if someone wants to work together on it then please get in touch. I'll also write up my experiments if you comment and ask for it.
- jedimastert 8y ago
  The PICO-8 "fantasy console" is a playful old-school computer style emulator that passes it's programs through images. You might even look into it's algorithms [1]. I think it'd be perfect. [1]: http://pico-8.wikia.com/wiki/P8PNGFileFormat http://pico-8.wikia.com/wiki/P8PNGFileFormat
  - sp332 8y ago
    Also the Spore Creature Creator from 2008 could export and import your creatures as PNGs. It used the least-significant bit in each color channel.
ritlq 8y ago
This seems like a website version of the Library of Babel
ArtWomb 8y ago
It's a legit pattern. Compression of binary data. Encoding to base64 string. And packing into data uri. Golang out of the box has packages for handling the entire pipeline. You get a small performance hit on page load from decoding. But its still performant and bandwidth-saving. For network constrained users this is a solution. Also consider the scenario where you are bootstrapping. Serving static content from a single server instance or S3. But still want to target a global audience ;)
ttttt1 8y ago
https://itty.bitty.site/#/?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 https://itty.bitty.site/#/?XQAAAAJc2QAAAAAAAAAeHQgmOm3if2bOh...
EddieDevalara 8y ago
Love it! https://itty.bitty.site/#Hello/?XQAAAAIDAwAAAAAAAAAeGQknlxhIQakTsdMIbU8HlOZm/BDoJ2nSs58e048WkaWOrss+S6eHpsZSq6yRrN7Rme6MnkC8igbOQaDSEcCsEIMeRTt2WdOH3QwOZdSYjNE1TfTz4bPVzvJ1U6wyMS+p1DUito7UecYiggwLdi5nBWYPTDTK7TM2UQoRQR5PWT64d82WF0/qJj0nVM46mfsJ+HsMj8uzkNEswBVm2xdVmqJoH2ScQZaLJag3/woG8muMaSQl4Pu4fUV2+BhdN3ePErXGm4oPw6JDBTpSKpH4GREI3FftIeIPsTSkbH93C2mdm8sP5S0TmbThTHTns3ioOM1FODEHMVzaj1yNMwnrg2iLNnzZQUTwgf8A5wJjy6DE1eVZigoPsFt/NVFz14uf1zfxmNzvbbH0apTqh6q8bD85D8ItoLtftudLpkBRVOyKCXz9d+4wYf1E56LCHgUo+RJnZl0RPYjWPD4JvSJYj7wrYXU9DgQq7sZlqkrJEkWlAD1l+nZizcg04T26xOgP2cDXe/qhcAgHimV9FsC55PIxEqIWVps6yvG0CmbQf2Q/1nhjanz+P8VSJImJ+PhR/Q9YWY4Y2Ijvvq+AP2ckN3w8xar9ZXwO0bvMO2ex125DyhQXxG6tEEGaDv/Pip9q https://itty.bitty.site/#Hello/?XQAAAAIDAwAAAAAAAAAeGQknlxhI...
feikal 8y ago
nice. i remember something like this over 10 years ago, but people back then were not getting it...
indigodaddy 8y ago
So if one must think about it in terms of client/server (my mind works like this), since the website data is contained in the URI itself, then the server/site where you clicked on the URL from, can perhaps we thought of as the "web server" per se. Just a way for me to think about it. This is pretty crazy though, neat stuff.
davidcollantes 8y ago
What is required to run this on own web server? Is there something else to it, such as node?
- Jaruzel 8y ago
  No, you just host a local copy of the JavaScript file that the page calls to decode the URL.
erlehmann_ 8y ago
I strongly suggest to not use this. Instead, create URIs that contain arbitrary content with the data URI scheme: https://en.wikipedia.org/wiki/Data_URI_scheme https://en.wikipedia.org/wiki/Data_URI_scheme The data URI scheme is standard and widely supported, does not rely on the host bitty.site being reachable and does not need JavaScript. One can even create data URIs with a small shell script that is given a filename argument: #!/bin/sh -eu printf 'data:%s;base64,%s' "$(file -bi "$1"|tr -d ' ')" "$(base64 -w 0 "$1")"
kazinator 8y ago
Data URL's do this without relying on the server. E.g. this one cribbed from StackOverflow: data:text/plain;base64,SGVsbG8sIHdvcmxkISBJJ20gZG93bmxvYWRlZCB2aWEgImRhdGE6dGV4dC9wbGFpbjsuLi4iIFVSTCB1c2luZyA8YSBkb3dubG9hZD0iZmlsZV9uYW1lIi4uLj4uDQpNeSBiaXJ0aHBsYWNlOiBodHRwOi8vc3RhY2tvdmVyZmxvdy5jb20vcXVlc3Rpb25zLzY0Njg1MTcvDQoNCk1vcmUgYWJvdXQ6DQpodHRwOi8vd3d3LnczLm9yZy9UUi9odG1sL2xpbmtzLmh0bWwjYXR0ci1oeXBlcmxpbmstZG93bmxvYWQNCmh0dHA6Ly93d3cudzMub3JnL1RSL2h0bWwvbGlua3MuaHRtbCNkb3dubG9hZGluZy1yZXNvdXJjZXMNCg0KQnJvd3NlciBzdXBwb3J0OiBodHRwOi8vY2FuaXVzZS5jb20vZG93bmxvYWQ=
bkul_ 8y ago
Finally, a use case for code golf!
dandare 8y ago
The de-facto limit for the number of URL characters is around 2000 but it greatly varies per browser. See https://stackoverflow.com/a/417184/487771 https://stackoverflow.com/a/417184/487771
recursor 8y ago
Hypothetical: Might a bad actor user something like this, combined with a homograph domain, to conceal malicious content in the URL and prevent a crawler discovering the malicious content (ignoring the fact that the homograph might be detected/redflagged on its own). (use case might be a homograph phishing site, with a fakelogin and the target for the captured input being obfuscated into the URL) ---- Note: Homograph effectiveness depends on the browser, which you'd hope all be improving detection over time- https://dev.to/loganmeetsworld/homographs-attack--5a1p https://dev.to/loganmeetsworld/homographs-attack--5a1p
hackadoodle2 8y ago
Hmmm... https://www.engadget.com/2017/05/20/how-to-hide-tiny-artworks-in-your-urls/ https://www.engadget.com/2017/05/20/how-to-hide-tiny-artwork... https://hackaday.com/2017/05/13/javascript-art-is-in-the-url/ https://hackaday.com/2017/05/13/javascript-art-is-in-the-url...

420 points by Pulcinella 8y ago

This is neat! I did something similar with https://tinysite.adamdrake.com https://tinysite.adamdrake.com where I have a website that fits into a single ipv4 datagram (at least it did when I was using my own HTTP server). More details here: https://adamdrake.com/the-biggest-smallest-website.html https://adamdrake.com/the-biggest-smallest-website.html

duxup 8y ago
Someone has to combat our wasteful packet usage!
ReverseCold 8y ago
It's 9XX bytes, is the extra from TLS?
- adamdrake 8y ago
  When I moved it to AWS Lambda there was some size introduced from TLS and also from some headers that AWS API Gateway adds which seem, unfortunately, impossible to easily drop (e.g., if you make the headers empty in the response, APIGW will copy them into another header and still add its own). I might pull that service off of AWS APIGW/Lambda, in which case the size as an artifact of AGIGW would disappear again.

saagarjha 8y ago

I wonder how large a website using this scheme can practically be to work on most browsers. I know of at least one browser that limited URLs to 100 characters, but it's almost 30 years old…

lainga 8y ago
While most sites/apps support about 2000 bytes (2KB), some can handle more... Twitter and Slack, for example, allow 4000 bytes in a link. 4000 bytes is enough to apparently encode the full text of Poe's The Raven. https://twitter.com/edgar_the_poe/status/1003524516440563712 https://twitter.com/edgar_the_poe/status/1003524516440563712
- kovek 8y ago
  It's now hosted on tinyurl: https://tinyurl.com/yafprdyo https://tinyurl.com/yafprdyo
- yourad_io 8y ago
  The HN frontpage bitty that I posted in another comment is around 8K. [1] I also did a reddit one that works on my browsers[2] (copy/paste URL into new tab) at 26K (!). Which is apparently too much for HN. (Where's my free 5GB of storage for signing up?!) [1] https://news.ycombinator.com/item?id=17460932 https://news.ycombinator.com/item?id=17460932 [2] latest chrome, firefox on ubuntu

ummonk 8y ago

Don't use this for anything where you don't want cross-site-scripting vulnerabilities...

chias 8y ago
What would such a cross-site scripting vuln do? There isn't anything to steal. Moreover you wouldn't use this for anything where you aren't in control of where people get the links from, because as soon as someone else starts sharing it they can of course edit it too.
- gbba 8y ago
  The trustworthiness of the domain name would effectively be stolen.
  - chias 8y ago
    I disagree. It's more similar to how you can "inject" your scripts into fiddle.jshell.net (via JSFiddle), googleusercontent.com (via Google Translate), etc. Have a look at https://fiddle.jshell.net/pvcL4mjh/1/show/light/ https://fiddle.jshell.net/pvcL4mjh/1/show/light/ Would you call that XSS / did I just steal JSFiddle's trustworthiness?
    - ummonk 8y ago
      That's a fair point.

Gaelan 8y ago

How does this compare with data URLs?

sirsuki 8y ago
It is smaller then data urls becausde the base HTML and javascript is provided by the itty.bitty server and not part of the data url. Only the inner content is encoded. So it is much smaller then a data url but requires a server to serve the initial decoding HTML page.
- zeroimpl 8y ago
  The base HTML/javascript coming from the itty.bitty server does not make it smaller. As a matter of fact, it appears that the javascript provided by itty.bitty simply decompresses the URL fragment and then converts it into a data-URI and passes that to an iframe. So it is smaller than a data URI - but only because it is compressed.

waisbrot 8y ago

The link says > nothing is sent to–or stored on–this server but isn't it the case that the entire page is sent to bitty.site as part of the HTTP request?

emp_ 8y ago
The location.hash (#About...) is not sent to the server, which is where the content is rendered from.
sirsuki 8y ago
No, the page content is never sent to the server. all the server does is serve a static HTML page with some javascript. The javascript reads the compressed encoded data in the URL (the fragment which browsers never send to the server during a request) and then it decodes the data and writes the data to the current DOM. All content data is stored in the link itself and never seen by the itty.bitty server.
brod 8y ago
most http clients (browsers included) will omit url data after the # character, eg: `https://itty.bitty.site/#About/XQAAAAKrCQAAA...` https://itty.bitty.site/#About/XQAAAAKrCQAAA...` only sends `https://itty.bitty.site/` https://itty.bitty.site/` to the server.

chias 8y ago

This is neat! My second reaction (after "awesome!") was that I'd love for this to support some kind of optional identifier+hmac functionality. That's not necessary for when you are fully in control of where people get the links of course, but as soon as someone starts sharing links to "your" content they can by definition modify it as well. It'd be cool if I could share a page that says "by chias" and that can prove it. Then again, that would require itty-bitty to know that I exist, store my key somewhere, have some kind of auth system for me to log in and set my key... and now we're talking usernames, passwords, recovery email addresses, etc. etc., and I love the concept of services offered to people that explicitly don't do any of that. So third reaction is that it's great as-is :)

ponyfleisch 8y ago
you could just sign your content yourself using a publicly known key (e.g. keybase.io) Support for keys as a separate content "field" could be added to itty bitty i suppose?

the_d00d 8y ago

Great work and congrats on making it to the top of HN. I did something similar awhile back...I called it inception host :) https://github.com/jrhea/inception/blob/master/readme.md https://github.com/jrhea/inception/blob/master/readme.md

Exuma 8y ago

https://itty.bitty.site/#/?XQAAAALfAAAAAAAAAAA0HSzgdXPvDK5AEi+dXR+Wp+VBBrHPUivt9QmuGfWQLaDzPoK1OINSJH8kY65bBkC0AlA1z6uxBe7XA66svOmlKtUCOjl0NqBjRKWb1K7gATXv4mdfvrbLH5qIBs5OFCEc6mlFqEjzlA+4tzQ2BFx2AqwbP6tWoWy6moAmT2l0YRTSngwnsoOTx/0QOUOV6SAmdcHylijJ+B6JLRuPYqaZVy83XDw61WKkzUCsVYmJ9n0ZxIUlcCjMfvDISU/0KPDsTkpWNaIRmjH4eef//j62gA== https://itty.bitty.site/#/?XQAAAALfAAAAAAAAAAA0HSzgdXPvDK5AE...

TimTheTinker 8y ago
Hi to you too :-)
mchahn 8y ago
I just get a page with the URL shown.
- Exuma 8y ago
  your first clue
  - flyGuyOnTheSly 8y ago
    OK so you keep following the links (by copying and pasting into your address bar) and after about four links it says "oh hi ". Explain yourself! How did you do this?! Impressive!
    - sterlind 8y ago
      Simple! 0. Write oh hi :D, get link0 1. Paste link0, get link1 2. Paste link1, get link2 ... Encoding goes E(T), E(E(T)), etc. let K be the per-char encoding overhead, so E(T) = KT: complexity is O(K^N * T) where N is number of levels and T is length of text at level 0!
      - flyGuyOnTheSly 8y ago
        D'oh! You're right! That IS simple!

shitloadofbooks 8y ago

This seems like an exceptionally bad idea. Even if if just used it for my blog, an attacker can craft a URL which renders obscene content ("Hitler did nothing wrong"), then scatter that link everywhere on the web and get it crawled. Eventually it shows up in searches, but it's definitely "on my domain." Furthermore, it's like running a public anonymous FTP, it'll just get used as a malware hosting tool as soon as it's found.

wyldfire 8y ago
Will crawlers do the js DOM rendering before the page is indexed?
- danShumway 8y ago
  I think that Google does actually wait for Javascript to finish running. I don't think that it indexes URLs with their query params though. Maybe I'm wrong about that. Not sure why it would be a problem though even if it did - if you've ever hosted content on Instagram, Reddit, Facebook, Twitter, or, heck, even HackerNews, it seems like you'd have the exact same threat model.
danShumway 8y ago
I don't follow. I have a Twitter profile. If someone else shares racist stuff on their Twitter profile, is it "on my domain?" In any case, I'm skeptical that you would ever use this for a blog because the links are immutable. You'd have to either change your homepage every time you updated your blog, or you'd have to dynamically render your homepage in Javascript by querying another server - and if you're gonna do that, what's the point? Just host your own stuff then. What this gives you is a way to share static content where your entire app/page can be distributed in the url with extremely minimal server interaction. There's no risk of malware or vandalism because there's nothing actually being hosted - the URL is the data. When you share it with someone you know exactly what they're going to see when they click on it. I can think of a lot of uses I might have for this; even just minor things like sharing quick lists with family members. Updating the URL whenever I changed something would be annoying, but the benefits might outweigh the drawbacks. Edit: Are you talking about domain forwarding? I could see how that would be problematic. It didn't occur me because I'm not sure what the advantage would be. I don't think I've ever been in a situation where it was too cumbersome for me to host static content somewhere, but not too cumbersome for me to buy a domain and edit its config whenever I published content.

mkj 8y ago

Ah, it's by Nicholas Jitkoff, of mac Quicksilver fame. More elegant design. Edit: Oh, a bit more googling and he was lead designer for Material Design.

ehnto 8y ago

I do something similar in a bookmarklet to give myself a nice looking notepad. It's essentially a padded content editable div, with a prepopulated H1. This lets me print it out or save it as a document when needed. Which is never.

carapace 8y ago
Oh yeah! data:text/html,<html contenteditable></html> That's one of my favorite "stupid HTML tricks". I wonder who first figured it out? I can't find the original blog post (if it even was) and now it's a known thing: https://news.ycombinator.com/item?id=6005295 https://news.ycombinator.com/item?id=6005295 https://www.simonewebdesign.it/how-to-make-browser-editor-with-html5-contenteditable/ https://www.simonewebdesign.it/how-to-make-browser-editor-wi... etc...

cetra3 8y ago

Just be careful about XSS: https://itty.bitty.site/#/?XQAAAAIhAAAAAAAAAAAeHMhnVbtj2LI970NQdDTNrv4CLR793gw6k3+xZwRpB///91FAAA== https://itty.bitty.site/#/?XQAAAAIhAAAAAAAAAAAeHMhnVbtj2LI97...

tantalor 8y ago
Why
- cetra3 8y ago
  If you're using this in your site as it stands, you are opening up XSS attacks as it does not appear to sanitise user input.
  - tantalor 8y ago
    Only if you do something silly like serve cookies on that domain
    - comesee 8y ago
      I think this is ignoring the content of his warning and is a tautology. "it's only opens up an attack if you allow the attack vector"

shakna 8y ago

So from Content Lengths [0]... You've tested on Chrome, and IE, but not Firefox? [0] https://itty.bitty.site/#Content_Lengths/XQAAAAIXAwAAAAAAAAAeHMqHyTY4PyKmqfkwr6ooCXSIMxPQ7ojYR153HqZD3W+keVdvwyoyd+luwncAksyBpBYltNr1Oj+0nFtw4rO71K7JRYBTu1/STbYi7TdKa6fx163w7+2NwPfmhoOPwFp2gWV4ZXeA0rB2gi0U/f9/E2cOaRXxIZgD6U7i6ie89XizK8ZD8Fq+/mkO2WT2uJMvs2IVmwdqcjmEFhkmeDr9BaUhampEh70WRk2sC97NHMFXHGhvU8nA5nGjHVrGCTMai5A+JsPaT5GVV8z6vEm8YhzZD8pHG1qLCbyRSpjFAVw8JVmePH6EIs0Oaa14O3tpLFoWCAEJ2uDF4Nyq3gOAMQGhSn5vwAFE2Y7iaghGFqMt4jsAnig63UM/dklujh27iHRdCMUdPttYxqZDghrhxUM/ge+Tlln5hcbX4Z5BIbtRXQW8R2Zjf8t/46VOvuURbM0yu3JmIbMLZxPcv/N1z0wAB8FWVKblgtwaPl5E1MfmdoITh5g4JL3LW2+EWFQkJOBvITY/PO6EvWgWyxD9Ugi6X8SFa+VHexlxpQTDJ+FUja6Yn/W1k2Zi7ypJLnPvCmkCmGiEMzuIzNPF/ygWcwA= https://itty.bitty.site/#Content_Lengths/XQAAAAIXAwAAAAAAAAA...

sp332 8y ago
Firefox's is very useful for testing image data URIs. You can paste the whole thing into the address bar and it will render the image.

Pica_soO 8y ago

Nice one. https://boutell.com/newfaq/misc/urllength.html https://boutell.com/newfaq/misc/urllength.html JS-Fat-site shaming by link.

djsumdog 8y ago
huh. I know a lot of early buffer overflows came via the URL back in the early 2000s and early IE days. I can understand why there shouldn't be a theoretical limit today, at least until your machine would run out of resources. 32GB url anyone?

ryanpetrich 8y ago

A quine: https://itty.bitty.site/#/?XQAAAAIPAQAAAAAAAAAeGEPDwwAoaS2SjfmzbgJNBE+G+K4XOI91HV7SWCkxcfvhG0ogKSeNhUBdXvB6YB8z730BjbgRiydXuBgVTKkUl8fX5BZQGkYaqyDbdXWLJME3xFVLOuG1u/u73lcdjsRW02LnLnQRYi/2ZaPht09tMM/UgfxPyxisKUhh6b3Wz8o+jwEeQOYLSErM/qwMY9FgYA6o0WUQ8BBoN07NM08ltpAvbzrghducIPKuZuw0exavcBomDwk6kBr57ok8cKR3KDFsL/1SnhNGyG1fqGRw3/52oh0= https://itty.bitty.site/#/?XQAAAAIPAQAAAAAAAAAeGEPDwwAoaS2Sj...

ponyfleisch 8y ago
nice! how did you do it?
- ryanpetrich 8y ago
  As others have pointed out, it's not quite a quine and just some silly JavaScript that reads out its source from the DOM and feeds it back into a copy of Itty Bitty's URL generation algorithm.
erdemozg 8y ago
It's like an image containing its own SHA2 hash. How is it possible?
- saurik 8y ago
  A quine is more similar to (but not quite the same as) an uncompressed image containing a QR code with a compressed copy of the same image, which has its own challenges; but like, a cryptographic hash function (such as SHA2) is designed explicitly to make this hard... if you had chosen a simple checksum instead it would be trivial to create an image containing the text of a checksum of the image: a compression function (particularly a tiny custom one designed for this one time use, that removes barely any entropy at all) is predictable enough to be manipulated. (edit: I hadn't looked at this one, though; but now that I see its code, apparently it is just cheating by accessing its own code via the DOM; it doesn't need to do that, and it doesn't even really feel like a "quine" to me given this implementation.)
- lurenjia 8y ago

JAdamMoore 8y ago

This is old news from 2011. https://news.ycombinator.com/item?id=2464213 https://news.ycombinator.com/item?id=2464213 It was done better by David Chambers https://github.com/hashify/hashify.me https://github.com/hashify/hashify.me And you can use it here: http://hashify.me/IyBUaXRsZQ== http://hashify.me/IyBUaXRsZQ==

recursor 8y ago
That's cool, I hadn't come across hashify before, but I'm not sure about "better" overall - depends how you're using it... ...itsy bitsy site's demo page gives a couple of nice additions * I use markdown a Lot, but the inclusion of codepen.io makes it simple to compose richer docs, including svg's in a page etc. (I haven't read the hashify code - I'm assuming it does support full HTML, not just MD, but the demo doesn't make that clear) * QR code link - is just using a 3rd party zXing tool, but, nice touch for the demo * Compression - hashify URLs seem to be longer than the content (that might mean lower effective limits on content lent), relying on 3rd party lookups for shortening, meaning accessingv the content offline looks harder to achieve (afaict itty bitty just needs the JS to decode the url)

yourad_io 8y ago

Try this: CTRL+A CTRL+C on a simple-ish site, then paste on itty bitty. Works surprisingly well - with the exception of images not rendering. Super quick static mirroring. I like. Edit: tabular format is preserved as well - copy paste from Excel :ok_hand: Edit: Bookmarked! I'm going to use this for sure. Idea: A javascript bookmarklet of some sort may be nice here. Maybe "create itty.bitty site from current selection" or "... from entire page"?

yourad_io 8y ago
HN: https://itty.bitty.site/#/?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 https://itty.bitty.site/#/?XQAAAAIj+AAAAAAAAAAeHQgmOm3if2bOh... Links are functioning BTW.

djsumdog 8y ago

It does require Javascript to render.

Double_a_92 8y ago
It does the decompressing and everything on client side. How would you do that without?
- nateguchi 8y ago
  css
  - Double_a_92 8y ago
    A decompression algorithm in CSS? What?

qiqitori 8y ago

Another service that does the same thing: http://urlhosted.graphicore.de/ http://urlhosted.graphicore.de/ From http://urlhosted.graphicore.de/about.html http://urlhosted.graphicore.de/about.html: "urlHosted is an experimental web app that misuses the part after the "#" of a URL to store and read data."

pwaai 8y ago

very cool idea! https://itty.bitty.site/#/?XQAAAAIOAAAAAAAAAAAwnOxAdDhz11dLCTweFrUkFP/wyMAA https://itty.bitty.site/#/?XQAAAAIOAAAAAAAAAAAwnOxAdDhz11dLC...

trqx 8y ago

github page is missing instructions to inline the whole html/js/css package in a single file. Is it common knowledge?

finagle 8y ago

Cool hack aside, can anybody think of an actual use case for this?

ddalex 8y ago
Copy/paste content to my coworkers, like paste-bin. but without server-side storing on the paste site. It's amazing.
- e12e 8y ago
  So rather than paste the text.. Paste the link, which they then open, to fetch the render-Middleware from this site, to render the text in the browser? Rather than just allowing the message app render the text in-line or as an attachement?
  - recursor 8y ago
    Hmmm. Could you not put an encryption layer into a derrivative of this for some generic PGP end to end encryption, without involving/trusting a centralised provider..?
    - e12e 8y ago
      You'd need to trust the (de) cryption code... So probably better off with cutting and pasting with gpg --armor...
mstade 8y ago
My mind immediately went to stuff like tickets. Can't say how many times I've gotten stuck having my ticket checked at a concert or on a train simply because there's no connectivity and the page is no longer in cache on my phone. If all the data is in the URI then it could work as an option for entirely static data. I'd say this is useful for almost anything that fits in a one page PDF.
- Lxr 8y ago

helpme420 8y ago

Nice...

peterburkimsher 8y ago

I discovered data URIs in 2014, when trying to make an app that doesn't need to be distributed through an app store. They're fun. Nihilogic made a 14KB Mario clone that can be fit into a data URI. https://web.archive.org/web/20090310220414/http://blog.nihilogic.dk/2008/04/super-mario-in-14kb-javascript.html https://web.archive.org/web/20090310220414/http://blog.nihil... I also know about the way Cemetech's jsTified TI-83 emulator parses pictures to load a calculator ROM file (steganography). https://www.cemetech.net/projects/jstified/ https://www.cemetech.net/projects/jstified/ I put those two together, and imagined a new form of app distribution, which I call "Fondant". 1. Click a data URI bookmarklet. That is a bootloader, with the parser code for a picture. It presents a button to upload a picture. 2. Select a picture from the camera roll, which is the app. 3. To save, generate a picture and save that to the camera roll. This could be used to transfer other file types (e.g. a music player with a mixtape) over universally-supported photo sharing platforms. Unfortunately, the iPhone recompresses JPGs when clicking Save to Camera Roll, and the lost quality means the photo isn't parseable the next time. I did some experiments, and turned a blue/green checkerboard pattern into grey after 50 repeated Saves. I still think there's potential in the idea; if someone wants to work together on it then please get in touch. I'll also write up my experiments if you comment and ask for it.

jedimastert 8y ago
The PICO-8 "fantasy console" is a playful old-school computer style emulator that passes it's programs through images. You might even look into it's algorithms [1]. I think it'd be perfect. [1]: http://pico-8.wikia.com/wiki/P8PNGFileFormat http://pico-8.wikia.com/wiki/P8PNGFileFormat
- sp332 8y ago
  Also the Spore Creature Creator from 2008 could export and import your creatures as PNGs. It used the least-significant bit in each color channel.

ritlq 8y ago

This seems like a website version of the Library of Babel

ArtWomb 8y ago

It's a legit pattern. Compression of binary data. Encoding to base64 string. And packing into data uri. Golang out of the box has packages for handling the entire pipeline. You get a small performance hit on page load from decoding. But its still performant and bandwidth-saving. For network constrained users this is a solution. Also consider the scenario where you are bootstrapping. Serving static content from a single server instance or S3. But still want to target a global audience ;)

ttttt1 8y ago

https://itty.bitty.site/#/?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 https://itty.bitty.site/#/?XQAAAAJc2QAAAAAAAAAeHQgmOm3if2bOh...

EddieDevalara 8y ago

Love it! https://itty.bitty.site/#Hello/?XQAAAAIDAwAAAAAAAAAeGQknlxhIQakTsdMIbU8HlOZm/BDoJ2nSs58e048WkaWOrss+S6eHpsZSq6yRrN7Rme6MnkC8igbOQaDSEcCsEIMeRTt2WdOH3QwOZdSYjNE1TfTz4bPVzvJ1U6wyMS+p1DUito7UecYiggwLdi5nBWYPTDTK7TM2UQoRQR5PWT64d82WF0/qJj0nVM46mfsJ+HsMj8uzkNEswBVm2xdVmqJoH2ScQZaLJag3/woG8muMaSQl4Pu4fUV2+BhdN3ePErXGm4oPw6JDBTpSKpH4GREI3FftIeIPsTSkbH93C2mdm8sP5S0TmbThTHTns3ioOM1FODEHMVzaj1yNMwnrg2iLNnzZQUTwgf8A5wJjy6DE1eVZigoPsFt/NVFz14uf1zfxmNzvbbH0apTqh6q8bD85D8ItoLtftudLpkBRVOyKCXz9d+4wYf1E56LCHgUo+RJnZl0RPYjWPD4JvSJYj7wrYXU9DgQq7sZlqkrJEkWlAD1l+nZizcg04T26xOgP2cDXe/qhcAgHimV9FsC55PIxEqIWVps6yvG0CmbQf2Q/1nhjanz+P8VSJImJ+PhR/Q9YWY4Y2Ijvvq+AP2ckN3w8xar9ZXwO0bvMO2ex125DyhQXxG6tEEGaDv/Pip9q https://itty.bitty.site/#Hello/?XQAAAAIDAwAAAAAAAAAeGQknlxhI...

feikal 8y ago

nice. i remember something like this over 10 years ago, but people back then were not getting it...

indigodaddy 8y ago

So if one must think about it in terms of client/server (my mind works like this), since the website data is contained in the URI itself, then the server/site where you clicked on the URL from, can perhaps we thought of as the "web server" per se. Just a way for me to think about it. This is pretty crazy though, neat stuff.

davidcollantes 8y ago

What is required to run this on own web server? Is there something else to it, such as node?

Jaruzel 8y ago
No, you just host a local copy of the JavaScript file that the page calls to decode the URL.

erlehmann_ 8y ago

I strongly suggest to not use this. Instead, create URIs that contain arbitrary content with the data URI scheme: https://en.wikipedia.org/wiki/Data_URI_scheme https://en.wikipedia.org/wiki/Data_URI_scheme The data URI scheme is standard and widely supported, does not rely on the host bitty.site being reachable and does not need JavaScript. One can even create data URIs with a small shell script that is given a filename argument: #!/bin/sh -eu printf 'data:%s;base64,%s' "$(file -bi "$1"|tr -d ' ')" "$(base64 -w 0 "$1")"

kazinator 8y ago

Data URL's do this without relying on the server. E.g. this one cribbed from StackOverflow: data:text/plain;base64,SGVsbG8sIHdvcmxkISBJJ20gZG93bmxvYWRlZCB2aWEgImRhdGE6dGV4dC9wbGFpbjsuLi4iIFVSTCB1c2luZyA8YSBkb3dubG9hZD0iZmlsZV9uYW1lIi4uLj4uDQpNeSBiaXJ0aHBsYWNlOiBodHRwOi8vc3RhY2tvdmVyZmxvdy5jb20vcXVlc3Rpb25zLzY0Njg1MTcvDQoNCk1vcmUgYWJvdXQ6DQpodHRwOi8vd3d3LnczLm9yZy9UUi9odG1sL2xpbmtzLmh0bWwjYXR0ci1oeXBlcmxpbmstZG93bmxvYWQNCmh0dHA6Ly93d3cudzMub3JnL1RSL2h0bWwvbGlua3MuaHRtbCNkb3dubG9hZGluZy1yZXNvdXJjZXMNCg0KQnJvd3NlciBzdXBwb3J0OiBodHRwOi8vY2FuaXVzZS5jb20vZG93bmxvYWQ=

bkul_ 8y ago

Finally, a use case for code golf!

dandare 8y ago

The de-facto limit for the number of URL characters is around 2000 but it greatly varies per browser. See https://stackoverflow.com/a/417184/487771 https://stackoverflow.com/a/417184/487771

recursor 8y ago

Hypothetical: Might a bad actor user something like this, combined with a homograph domain, to conceal malicious content in the URL and prevent a crawler discovering the malicious content (ignoring the fact that the homograph might be detected/redflagged on its own). (use case might be a homograph phishing site, with a fakelogin and the target for the captured input being obfuscated into the URL) ---- Note: Homograph effectiveness depends on the browser, which you'd hope all be improving detection over time- https://dev.to/loganmeetsworld/homographs-attack--5a1p https://dev.to/loganmeetsworld/homographs-attack--5a1p

hackadoodle2 8y ago

Hmmm... https://www.engadget.com/2017/05/20/how-to-hide-tiny-artworks-in-your-urls/ https://www.engadget.com/2017/05/20/how-to-hide-tiny-artwork... https://hackaday.com/2017/05/13/javascript-art-is-in-the-url/ https://hackaday.com/2017/05/13/javascript-art-is-in-the-url...