This got me thinking... someone should build a local service that hosts a library of static web apps for use cases like this. Essentially, apps that are something between bookmarklets and Electron apps. Might even make Electron unnecessary for a bunch of use cases.
It would be neat to visit /app/notepad, /app/kanban, /app/todo, etc. at a localhost port, with an index of apps at /. There could even be a /get-apps page that connects to an npm-like library of single-HTML-file apps available for download from a github.io static site backed by a public repo that accepts pull requests.
I'd love to see all the VC-funded glorified desktop utilities on the web become unnecessary.
If you open up salesforce you have all these resource types and pages, but it's all fully customizable. There's a built-in programming language with many affordances to work in a dynamic environment (stuff like handling API changes), and you're basically able to point at a thing and get a breakdown of what it's like.
On top of this third party developers can build in stuff that is more or less first class to the system, and it can run on the third party systems but you can get away with using Salesforce's "compute". So you're shipping software for the Salesforce VM, so to speak.
I would recommend playing around with the system to see what's going on.
Coming back to this a few days later... it looks like the fastest way to implement this idea is to host a local TiddlyWiki instance. There are so many TiddlyWiki plugins that fit so naturally into the ideas I had above -- kanban, todo, and the wiki itself, among many others.
The next evolution would be to get it running in RedBean reliably - and maybe even get it saving Tiddlers to the built-in SQLite instance. Simon Willison's work on saving Tiddlers to SQLite in Python might be a good reference: https://github.com/simonw/datasette-tiddlywiki
On a related note I wish there were an easy way to deelectronfy electron apps. I don't know, perhaps some sort of patch you could apply to get it to act like a normal web app. and a local server to provide the file access.
Mainly I am bitter because nobody has ported electron to openbsd yet, cross platform my ass.
Thinking about this more - this might be a perfect use case for Redbean. Backend mini-app user data could be stored in SQLite. The server could store the actual apps' static files in its internal zip archive. All of that could easily be managed with a sprinkling of Lua.
The mini-apps could store data in localStorage, but that would expose the data to other mini-apps. Maybe build an easy API that functions nearly equivalently against a Lua endpoint.
The problem with these supposedly local, private web apps on other people’s domains is that they can start stealing your data any time the page is refreshed. The author can turn malicious (or was malicious to begin with), they can sell the app or let the domain expire, or they can be hacked. The only way to prevent that is to firewall/null route that domain entirely after initial load and audit, and then you can’t ever refresh the page.
The web platform simply doesn’t allow you to verify the checksum of an app and reject all further requests.
A late edit for a brain fart: “and then you can’t ever refresh the page” should be removed since it can be served from service worker cache. You can’t refresh the page while allowing a connection to the server.
I'm not a web dev so I might be missing something. Theoretically you could just open .html files directly in the browser without any networking being involved, no?
In the past, yes, and you still could if you use old enough features, but nowadays browsers heavily restrict sites opened as just .html file. For example you could not use modules at all if they're in separate files.
That is at least until we get Isolated Web Apps and what ever the other proposals related to it alö called.
Is blocking access to local files a new thing? Considering the threat (you download a html file, open it in your browser and it tries accessing random files and exfiltrates them using JS), I would be surprised if this has worked in the past 10 years
> Essentially, apps that are something between bookmarklets and Electron apps.
You're talking about progressive web apps. MacOS / iOS / Android have them, and I started using them more recently. Essentially, they're just webviews wrapped in a native app.
PWAs have nothing to do with web views or native apps. They're just a collection of technologies (service worker, caching API, platform APIs, home screen installation, etc) that makes it possible to have offline available web apps that have a shortcut on your desktop/home screen. There is no web view or native app (outside of your default) browser involved.
Seeing the replies to your comment, I have to ask: Notepad++ persists your unsaved notes, has dark mode and themes, is fast and lightweight... why insist on forcing text-editor-like behavior on the browser? It feels like a solution in need of a problem.
(For myself) because 99% of my time is spent in an IDE or a browser, and there's less mental overhead for me to open a new tab and start typing than for me to open a new app and do so.
Sublime Text fits the “nameless notes” niche for me for similar reasons. It’s super speedy, has plenty of customizability, and has rock solid auto save+restore for unsaved text.
I hear people say it a lot and I know what they mean but I just can't agree... to me an OS runs on hardware. (or virtualized hardware) Browsers run on an OS. If you have "boot to browser" the OS is still the kernel. Browsers are userspace.
It's like that saying "The difference between a boat and a ship is that a ship can carry a boat, but a boat can't carry a ship." And I know there is jslinux but at that point we're in a Turing tarpit where you can say that the Lua VM or wasm is "an OS" and the term is just a five-dollar word for "abstraction layer". Is a function call an OS? Come on.
Right? I use the gnome default editor for this. Also persists unsaved notes, its always available and has some few basic features that sometimes come in handy (regex match, etc)
You should pick a text editor that doesn’t throw up a dialog when quitting then. I use CotEditor on macOS specifically for random notes, everything’s unsaved and some notes have survived dozens of reboots over a number of years.
I wonder if your notes were borked out of session.xml, but the files were still available at AppData\Roaming\Notepad++\backup.
I've changed machines where the user profile was in a different location, copied my AppData, and replacing the old location in Notepad++'s session.xml was enough to restore my unsaved notes.
Of course I tried everything (except looking in the shadow copy? Don't remember), but in the essence the shutdown triggered Save All workflow (somehow) and I responded with 'No'.
Nice! I bookmarked it and I'm gonna start using it, thank you.
For a quick and dirty save, you can press Ctrl+P to open the print window/dialog and select "Save as PDF", or you can press Ctrl+S and save as a single HTML file.
Edit: to make the text cursor focus automatically when the page loads, you can add the autofocus attribute to the body tag.
While you can't save to localStorage as my sibling commenters have shown,
greyface- down below in the thread posted a version that saves to the hash fragment of the URI. Saving to the (Data) URI has a benefit over localStorage of allowing you to save by bookmarking, which also enables you to save many notes, not just one.
I code-golfed greyface-'s code and made the text cursor autofocus on page load:
> Webstorage is tied to an origin. 'data:' URLs have unique origins in Blink (that is, they match no other origins, not even themselves). even if we decided that 'data:' URLs should be able to access localStorage, the data wouldn't be available next time you visited the URL, as the origins wouldn't match.
I made a very similar notepad tab. Only me and my girlfriend use it (since I don't market it or anything) but we've been using it constantly every day for about a year. I'm surprised it's not a default function of browsers to be honest - new tabs are such wasted space. Basically, every tab is the same document, it saves to the browser's cache locally so you don't lose anything when you close the browser. https://github.com/gth001/George-s-Notes-Tab-Extension
I play Simon's Tatham's puzzles from time to time to de-stress. I'm surprised it's not a default function of browsers to be honest - new tabs are such wasted space. How hard would it be to embed it in the new tab so everyone can enjoy some mental recreation?
While you might assume that Cloudflare "insights" is an advertising/analytics system, this is actually part of Cloudflare's anti-DDoS infrastructure. This "beacon" gets injected at random on Cloudflare-served HTML pages, to track you throughout your use of all Cloudflare-proxied sites, as an alternative to an evercookie in building a long-term reputation profile of "human browsing" for your browser.
This reputation profile is then used as part of the heuristic behind CloudFlare Turnstile's "Are you human?" checkbox.
This is why browsers that have NoScript enabled by default for all sites (e.g. Tor Browser), cause Cloudflare-proxied sites to throw endless security interstitials and never let you through, even when you disable NoScript for the protected website. Without reputation-profile data gathered from other sites, Cloudflare just sees a fresh browser profile making its first connection ever to some obscure site that nobody would ever actually visit as the first thing they do on a new computer. And so it thinks your browser is a (not-very-clever) bot.
I don't think it's possible for a site owner to opt out of this reputation-profile data gathering, while still relying on Cloudflare's DDoS protection.
However, I also don't believe that the data Cloudflare gathers via this route is sold to third parties. (Someone please correct me if that's wrong.)
It doesn't matter that this is a static site; it matters what it's hosted on.
If this static site is sitting on a CDN or Github Pages or something, then sure, there's no need to mask its IP address.
But if this static site is hosted on a cheap VPS or on a home PC with a residential Internet connection — or generally, anything with a monthly bandwidth usage cap — then any teenager who learns its true IP address (and then checks out that IP address's provenance with a whois(1)) could decide to pay $5 to throw a botnet at it for an hour — just because they know they can take it down by spending enough of its bandwidth, and want to try it, to be able to brag to their friends that they took something down.
(Yes, teenagers today do that. The most DDoS-ed things in the world today are Minecraft servers — because teens like messing with other teens.)
---
Also, half of what makes Cloudflare useful for "DDoS protection" isn't actually its "bot fight" security system, but rather its caching layer combined with its lack of egress costs (at least until you get forced into their Enterprise billing.)
If you are hosting your content on e.g. a public S3 bucket, where you're billed for egress bandwidth, but where S3 also sends sensible long-expiry Cache-Control headers; and you put Cloudflare in front of that S3 bucket (even just Cloudflare's free-tier offering!); then suddenly your S3 bucket will only be serving requests for each resource a few times a day, rather than for every single request. 99.999% of the traffic to your bucket will be a cache hit at the Cloudflare level, and so will be only a conversation between Cloudflare and the customer, not between Cloudflare and S3. So, even in the face of a DDoS, your billing won't explode.
And the data that's collected here includes the full page URL-- which, in this case, includes the fragment and therefore whatever data is being "stored", at the time of capture.
This is probably beyond the author's control, but they shouldn't host it somewhere that can inject scripts outside their control (like Cloudflare) and then claim "privacy".
(The Cloudflare script makes a request to `/cdn-cgi/rum`, with the full page URL in its JSON payload at `timingsV2.name`.)
> - Doesn't need cookies = immune to data loss by accident
How is this immune if you have to remember to save it manually? That seems much worse than relying on cookies. Sure you can maybe restore it from the browser history, but if cookies are not considered reliable, then the history even more so. It's easier to delete history than cookies.
Is there anything in the HTML spec that tells browsers to always show a cached version a page if it can't be loaded the next time you try to access it?
I think PWAs might have something like that, but haven't tested it in a normal browser or tried building one.
I'm not getting anything like that, for some reason. I assume I changed a setting and forgot. (probably something to make bookmarklets work) Pasted in URL bar in a new tab, private browsing, FF version 126.0, up to date fedora, history doesn't save.
HTML dictates how webpages should be structured and then rendered.
You're probably asking about HTTPS, in which case: No. The first rule about HTTPS is no caching, because you want to validate that what you see is from the server and you can't prove that with a cache.
It's actually much longer, I was implementing a javascript bookmarklet and the old published limitations are not respected by much anymore, so you can shove a LOT of data in there.
It’s actually compressed. It uses https://github.com/nodeca/pako and then applies base64. Try entering hundreds of "a" and you’ll see that the base64 doesn’t really get much longer.
It doesn't for me. Looks like they're just changing the html anchor (# …) with a location.replace which isn't a redirect so shouldn't spam history. Edit: Nevermind. It seems only Edge behaves this way.
This is really cool- I'm excited to dig through the code for this one!
A bunch of the comments talk about using in earnest- at the risk of sounding out of touch, if you want private, offline available notes, what's wrong with text files on a file system?
(I think my question looks sarcastic, but I'm genuinely interested!)
I created Ponder, which does something similar. Mine was inspired by the Alpha Smart, so it has 10 “files” and it saves to local storage, so it might not be loss proof, but I use it as a scratch pad and it works quite well.
Nice idea. But looks like this is unreliable, with some indeterminate cut-off point after which it stops working. I created 100 paragraphs of Lorem ipsum which I pasted into the textbox. It didn't show any error, but when I pasted the URL into a different window, the textbox just shows 'undefined'.
Shameless plug for my bookmarklet that solves the same problem all locally -- This is neat but if I were to use this, I would just use a more full featured site.
I love the idea after reading the example use case. Storing the text in a URL fragment is perfect for that use case. I can see myself using it. But it really needs to use `replaceState` instead of adding to the history stack on every character.
I am from marketing, so maybe I don't really understand the technical value here but how is it different than me opening a new Google doc?
I currently have a single doc file that I use like notes, as soon as I type "note" in my address bar, my browser automatically fills in the rest of the URL for the file (since I open is frequently).
The Doc file allows me to paste images, add links, or anything else essential for note taking. I don't need to save, or find the URL from browser history. Simply type and close.
For any new file, I can type Doc.new. It will work the same way.
The google docs experience is so spririt crushingly bad on an ipad (my preferred casual browsing / reading device) that I immediately bookmarked this site for those moments when I need to write and don't want to fetch my laptop.
This reminds me of a trivial browser notepad I hacked together a while back. Have been using this and has been indispensable - quickly open and jot down some notes. Has syntax highlighting and saves the notes to the browser db.
Cool concept but I would never use it. It's an archetypal example of the web being the champion of "worse is better." I am happy with just taking notes in a local text file using a text editor. This is not a complicated problem to solve.
Save notes by copying and pasting the URL? Why not just copy and paste the text itself? I don't need formatting in my notes.
I used to use VSCode for this but then they went and effed it up by adding so much spam to the app. If I happened to have an SSH open connection previously, it just reconnects to that and makes me wait, and then I have to press buttons to get back to a blank local workspace. Or sometimes it like splash up a "We added a bunch of features you didn't need" page. Ugh.
Whats the use case for this? What computing platform doesn't have a text editor, but does have a webbrowser? Or are we just conditioned to use a web browser for everything?
My exact use case was this: I created a tab group in Safari for working on a website, and wanted to jot down some to do items related to that project, and a tab in that tab group made the most sense.
I didn't want to write them down in a text editor, because they wouldn't have been bound to my context anymore.
Hope my explanation makes sense.
Fun fact: I saw people taking notes in translate.google.com for the same reasons that I created notepadtab.com.
It's stored in your history stack. I spent 15 seconds pressing the back button slowly becoming more and more horrified as I watched my characters disappear one by one.
You can see how it works for yourself by opening your browser devtools, opening the JS console, and typing
window.location.hash = "test"
You should see a "#test" pop up at the end of your URL. Pressing back will not change the page, but will make that go away.
Or, you know, use an actual notepad that lives on your computer.
I don’t understand why people find these tools exciting/useful. I never have to worry about losing data with TextEdit because it autosaves, natively, and is accessible outside the OS that the browser has become.
Nothing after the # will be sent over HTTPs but doesn't use of URL means its lost if you loose the URL - wouldn't local web storage be more 'secure' and also possibly syncable to other devices?
The URL is encrypted in HTTPS/TLS. An eavesdropper can see you making a TCP connection to the server, but everything above that layer, including the HTTP header with the URL, is encrypted payload.
It would be neat to visit /app/notepad, /app/kanban, /app/todo, etc. at a localhost port, with an index of apps at /. There could even be a /get-apps page that connects to an npm-like library of single-HTML-file apps available for download from a github.io static site backed by a public repo that accepts pull requests.
I'd love to see all the VC-funded glorified desktop utilities on the web become unnecessary.