I needed a way to share a link to a map, with drawings and the ability for the receiver to see their own location on the map.
Annotated screenshots solves the first but not the second.
Vibe engineered this, with many of the same ideas as OP.
Took an evening. Just in time apps for one specific use case is a thing.
And because it's so cheap to make and can be hosted cheaply with no backend, it can be given away for free.
https://nyman.re/mapdraw/#l=60.172108%2C24.941458&z=16&d=LU8...
While I'm all for vibe coding as appropriate, there's a lot of humor to be found it calling it engineering. :D
Is the code open source online somewhere?
Could we also add text annotations? Also the delete button could delete just the last shape or a selected shape so as not to start over?
And if you are open to bug reports.. if I move around the drawings move smoothly with the map, but if I zoom in/out the drawings move only after the map zooming animation ends, rather than smoothly
For fun I put it in chatgpt and asked if there are bugs.
It warned about fromBase64() and toBase64() not existing in main browsers. It is supported but is indeed a new "baseline 2025"feature. It suggested more compatible code using two small functions to convert characters manually.
"deflate-raw is not consistently supported." It suggested using 'deflate' instead.
> 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...
Here is the Crime and Punishment by Fyodor Dostoevsky:
- https://medv.io/goto/crime-and-punishment-by-fyodor-dostoevs...
https://github.com/swiftlang/swift-corelibs-foundation/blob/...
My absolute favorite thing about modernity is how enabled we are to riff on a riff of a riff.
In 1346, if a blacksmith came up with something cool, its quite possible that it died with them.
EDIT: actually I can edit the URL, but it takes a while to load.
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.
> 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.
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Refe...
https://gabrielsroka.github.io/webpages/calc.htm#a1:=Rate=3....
https://gabrielsroka.github.io/webpages/calc.htm#a1:=Rate=3.875;a2:=Years=30;a3:=NPer=Years*12;a4:=PV=644000;a5:=Pmt=Math.round(Math.pmt(Rate/12/100,NPer,PV)*100+1)/100;rows:5;cols:1
More examples
https://gabrielsroka.github.io/webpages/It's about 130 js loc
<script defer src="https://static.cloudflareinsights.com/beacon.min.js/vcd15cbe7772f49c399c6a5babf22c1241717689176015" integrity="sha512-ZpsOmlRQV6y907TI0dKBHq9Md29nnaEIPlkf84rnaERnq6zvWvPUqr2ft8M1aS28oN72PdrCzSjY4U6VaAw1EQ==" data-cf-beacon='{"version":"2024.11.0","token":"6a22b097a2b44fa4af0a95817ce96ab5","r":1,"server_timing":{"name":{"cfCacheStatus":true,"cfEdge":true,"cfExtPri":true,"cfL4":true,"cfOrigin":true,"cfSpeedBrain":true},"location_startswith":null}}' crossorigin="anonymous"></script>https://htmlpreview.github.io/?https://raw.githubusercontent...
but when I hit the keyboard I can see my it's is already loaded
Good job!
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).
https://gist.github.com/smcllns/8b727361ce4cf55cbc017faaefbb...
I don't think urls were built for that kind of punishment.
If you click save you get the option to use a URL.
The problem with a URL every edit is a new URL. So you send the URL to a friend, then fix a typo, they need a new URL.
The other problem is of course the space limit.
- https://textarea.my/#TYuxDcIwEEWpmeKUCiSIJQoKU0KFRBUWOGwnWDi...
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.
Not really… using js to change the CSS on the go is not a good practice. Why does it matter? Because of the “dark mode” browser extensions. They often use the presence of @media query (or other standard CSS means of setting dark mode colors), and if it’s the JS that changes the colors we often get partial Dark Mode, which does not work at all.
data:text/html, <html contenteditable>
<body id=b contentEditable onload=b[i="innerHTML"]=[(l=localStorage).c] oninput=l.c=b[i]>
[1] https://xem.github.io/postit/The sharing works just like here, by encoding the tab itself in the url.
hopefully mine can stand out with all the extra features i have managed to cram in
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.
--edit-- test link: https://linqshare.com/#eJxtkM9KxDAQxl-lzLmHrv8Ova3IHlz04BY8F...
Safari 15.6.1: Unhandled Promise Rejection: ReferenceError: Can't find variable: CompressionStream
Half a megabyte for a URL. That certainly is a thing.
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.
Percent encoding is particularly bad since it may also bloat the length causing truncation and the decompress to fail. There's endless footguns with URLs.