Was just working on something similar this morning. As an fyi you can avoid the string replacing in the base64 string by using `.toBase64({ alphabet: "base64url" })` and `fromBase64({ alphabet: "base64url"})`.
Per the spec [0], a URL can hold at least 8,000 characters.
> It is RECOMMENDED that all senders and recipients support, at a minimum, URIs with lengths of 8000 octets in protocol elements. Note that this implies some structures and on-wire representations (for example, the request line in HTTP/1.1) will necessarily be larger in some cases.
Mainstream browsers support at least 64,000 characters [1], and Chrome supports up to 2MB [2].
I guess the surveillance industry has enough incentives to make this ever larger, so they can fit more utm-trackers, campaign-ids, referal trackers and whatnot in URLs.
It's truly insane how large typical share-URLS for content on instagram, youtube or any other large platforms are. URLs that could've been example.com/t/some-large-enough-id?time=13337 are stuffed with hundreds of characters, just to gather more data on people using these links.
> Per the spec [0], a URL can hold at least 8,000 characters.
> It is RECOMMENDED that all senders and recipients support, at a minimum, URIs with lengths of 8000 octets in protocol elements.
It is always worth remembering that, unless you have already ensured that the content has been rendered into a URI-safe subset of ASCII, a character and an octet are not the same thing.
I recently build a small framework to create JavaScript apps that use this kind of URL sharing and therefore don’t require a backend: https://github.com/grothkopp/lost.js
Think you've inadvertently found a way to provide extra tests for mobile devices.
The Crime and Punishment one consistently crashes Brave mobile for me. I assume it's the length of the URL - and seen another commentator say the same for chrome mobile (sure they both use the same codebase so likely an upstream issue).
I made something similar once, specifically targetted for guitar tablature https://tabviewer.app/
To make links shorter for sharing with others, I use a shortlink service. Pasting URLs of thousands of characters long can be problematic
A few weeks ago I vibe coded a guitar tab editor just because I wanted to share a quick tab in a chat group with my band. When the first prototype already worked great, I just couldn’t stop to add features so that it now even has mouseover chord diagrams and copy and paste.
The sharing works just like here, by encoding the tab itself in the url.
Thanks for sharing! I tried a similar content-in-url approach for a family grocery list app but I couldn't get the url that short. (It worked but it was a bit cumbersome sharing over Whatsapp.) Will see what I can learn from this!
love it, funny enough, I had similar idea pop into my head some weeks ago, just to be able to store quick notes and favorite them in my browser for later
I like these kinds of projects, but adding a file export/import is inevitable. It's less about the limits of a URL and more about practicality.
I also have no way to confirm that URLs aren't logged server side, so I'd never trust the claim about "no tracking". That's why these projects also end up self-hosted.
Typos and URL mangles are common though, and I'd still have no way to confirm if it got logged in that case. It's out of scope for anything in the github source, and instead depends on the server hosting the page. I know this isn't meant to be super secure, but it's still worth a mention.
Typos aren't making the hash part turn into something else. Like your parent comment explained to you, the hash part is not sent to the server. If you go out of your way to mangle the URL then of course a mangled URL without hash will likely get logged to the server. But I'm not sure how one would manage to go so much out of the way that they mangle the URL in a way that removes the hash.
Was just working on something similar this morning. As an fyi you can avoid the string replacing in the base64 string by using `.toBase64({ alphabet: "base64url" })` and `fromBase64({ alphabet: "base64url"})`.
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Refe...
Per the spec [0], a URL can hold at least 8,000 characters.
> It is RECOMMENDED that all senders and recipients support, at a minimum, URIs with lengths of 8000 octets in protocol elements. Note that this implies some structures and on-wire representations (for example, the request line in HTTP/1.1) will necessarily be larger in some cases.
Mainstream browsers support at least 64,000 characters [1], and Chrome supports up to 2MB [2].
[0]: https://www.rfc-editor.org/rfc/rfc9110#section-4.1-5
[1]: https://stackoverflow.com/a/417184/
[2]: https://chromium.googlesource.com/chromium/src/+/HEAD/docs/s...
I guess the surveillance industry has enough incentives to make this ever larger, so they can fit more utm-trackers, campaign-ids, referal trackers and whatnot in URLs.
It's truly insane how large typical share-URLS for content on instagram, youtube or any other large platforms are. URLs that could've been example.com/t/some-large-enough-id?time=13337 are stuffed with hundreds of characters, just to gather more data on people using these links.
Chrome limit is 2MB, Firefox is 1MB, WebKit is no limit.
Here is the Crime and Punishment by Fyodor Dostoevsky:
- https://medv.io/goto/crime-and-punishment-by-fyodor-dostoevs...
For what it's worth, there might be a 2GB limit on iOS.
https://github.com/swiftlang/swift-corelibs-foundation/blob/...
LOL Tapping the address bar crashed my Chrome on mobile.
Works fine on Win11 Edge
> Per the spec [0], a URL can hold at least 8,000 characters.
> It is RECOMMENDED that all senders and recipients support, at a minimum, URIs with lengths of 8000 octets in protocol elements.
It is always worth remembering that, unless you have already ensured that the content has been rendered into a URI-safe subset of ASCII, a character and an octet are not the same thing.
Very good point indeed. In the worst case scenario, you would only have 1/5th of that capacity
I recently build a small framework to create JavaScript apps that use this kind of URL sharing and therefore don’t require a backend: https://github.com/grothkopp/lost.js
Think you've inadvertently found a way to provide extra tests for mobile devices.
The Crime and Punishment one consistently crashes Brave mobile for me. I assume it's the length of the URL - and seen another commentator say the same for chrome mobile (sure they both use the same codebase so likely an upstream issue).
I made something similar once, specifically targetted for guitar tablature https://tabviewer.app/ To make links shorter for sharing with others, I use a shortlink service. Pasting URLs of thousands of characters long can be problematic
Wow funny I‘m just seeing this after posting my tab editor in another comment. I have the same use case as you :)
https://github.com/planbnet/guitartabs
Nice! I love this.
I built Ponder in the same vein. It, however, has 10 files. I did not use the URL, did not have double the fun, and now I’m sad.
https://github.com/codazoda/ponder
A few weeks ago I vibe coded a guitar tab editor just because I wanted to share a quick tab in a chat group with my band. When the first prototype already worked great, I just couldn’t stop to add features so that it now even has mouseover chord diagrams and copy and paste.
The sharing works just like here, by encoding the tab itself in the url.
https://github.com/planbnet/guitartabs
This is very interesting, very refreshing, very simple and clever, very well done, very everything good. Bravo and thank you.
I love this.
Now if you bootstrap the app code into the url too then you can have a minimal kernel to run any machine in url.
Then you can also make a Quine somehow.
Thanks for sharing! I tried a similar content-in-url approach for a family grocery list app but I couldn't get the url that short. (It worked but it was a bit cumbersome sharing over Whatsapp.) Will see what I can learn from this!
Nice! I made a similar thing but the html for the text editor fits in a data uri, so it can be a bookmark or new tab page for taking quick notes
https://gist.github.com/smcllns/8b727361ce4cf55cbc017faaefbb...
Amazing. The crime and punishment example crashed my iPhone’s Google Chrome when I tap the URL haha
I have a similar one using localStorage https://github.com/mkaz/browser-pad
In case you missed it: it is possible to style textarea via CSS and share it.
- https://textarea.my/#TYuxDcIwEEWpmeKUCiSIJQoKU0KFRBUWOGwnWDi...
546,229 character-length URL for the Crime and Punishment example.
Half a megabyte for a URL. That certainly is a thing.
Just started making my own recently with CodeMirror 6 during holidays. No saving function for now: https://qbane.github.io/cgm
Love your other tools, btw!
Thanks!
Can you make it monospace by default, so that this can be used as a code snippet bin?
Sure! textarea.my support custom style attr: https://textarea.my/#Ky4tSlVUyCotLlEoLUhJLElVKC6pzElVSCwpKWJ...
How do you share after that? I can open devtools and change the attribute but the URL doesn't update after that.
Try https://a10z.co/note
It would be neat if ctrl+s offered to download the textarea to a .txt file.
love it, funny enough, I had similar idea pop into my head some weeks ago, just to be able to store quick notes and favorite them in my browser for later
https://textarea.my/#Cy4tsAcA
https://textarea.my/#Cy4tsOfi8ssvUcgtTc7QU_DIz0stLsmpVPBUSK0...
https://textarea.my/#ZY_NTgMhFIVd9ylYNZpMuQwDmZ9m4qM0SG9ncCg...
The only thing missing is markdown and few themes. I think this is awesome idea for sharing. Love what you did with it.
Love it!
Can you save anything?
https://textarea.my/#i0wtBgA=
Not OP: sure, just bookmark it
kinda -- but then you have to re-bookmark it every time you update it...
It also saves to localStorage
I like these kinds of projects, but adding a file export/import is inevitable. It's less about the limits of a URL and more about practicality.
I also have no way to confirm that URLs aren't logged server side, so I'd never trust the claim about "no tracking". That's why these projects also end up self-hosted.
hash part of url only available in the browser, as far as I know, server doesn’t have access to # value
Typos and URL mangles are common though, and I'd still have no way to confirm if it got logged in that case. It's out of scope for anything in the github source, and instead depends on the server hosting the page. I know this isn't meant to be super secure, but it's still worth a mention.
Typos aren't making the hash part turn into something else. Like your parent comment explained to you, the hash part is not sent to the server. If you go out of your way to mangle the URL then of course a mangled URL without hash will likely get logged to the server. But I'm not sure how one would manage to go so much out of the way that they mangle the URL in a way that removes the hash.