TiddlyPWA: putting TiddlyWiki on modern web app steroids | Hacker News Reader

TiddlyPWA: putting TiddlyWiki on modern web app steroids

val.packett.cool

122 pointstodsacerdoti34 comments

Wow TiddlyWiki reminds me of how I got started with web development in all the wrong ways.

I told my Dad I wanted to make a website for my favourite computer game so he sat me infront of MS Frontpage and got me started. After I while I got to the point i've made a forum but all the comments where dummy text in static HTML, so my Dad setup PHP on the computer and basically left me to it with a single index.php file and a intro to PHP book. The problem was when I looked things up, I was always asking the wrong questions. So instead of asking, "how can I store comments in a database and then fetch them for displaying?", I asked "how can I append a new comment to my HTML file?". I wound up with some crazy (working!) forum where every time a comment was added it would append to a HTML file. Then I wanted a more complex layout I had to figure out how to use a regex to append it in the right place. Then even more crazy regex to handle editing and deleting comments. Then when the file got too big I wanted to add pagination and this took me ages to get right shifting comments between pages when a comment was deleted so there was still 10 per page.

Eventually I discovered that databases exist and i've been a web developer for 18 years now.

Crazy to think there's now a cool use case for an entire app stored in a single .html file. Maybe I wasn't as dumb as I thought back then.

> every time a comment was added it would append to a HTML file

Hey static sites are a thing that keep coming back no matter how much things change. It doesn't matter how fancy your back-end for rendering/populating a website is when at the end of the day a lot of sites really really have no real need to be that dynamic. They could easily be rendered out to static files and be much more performant. Not to mention that if your backend falls over you still have some simple static files to spit out so people might not even notice downtime.

I don't think that's the wrong way to start with web development, especially as a kid. This gives you thorough understanding of why everything we use today is good to use, because you faced the exact problems these things want to solve.

I remember also starting building a forum and browser games using text files as database :)

Essentially CSV files pretty much, although I didn't think of them as CSV or similar.

I did the same thing! I remember we called them flat files or at least I did.

Then you go full circle and realize some databases just work with a file in the end and maybe we were on the right path to be db engineers

Sounds pretty efficient to me! Super cacheable, do effort on each write instead of each read, etc etc. Also I bet it reduced your time-to-shipping tremendously vs first learning databases. That reward cycle might matter more than following “best practices”!

Remember, if it’s worth doing, it’s worth doing half-assed.

I love this story! Reminds me of when I learned programming, in a similar I guided way. I wanted to build an environment to script football player movement on a pitch, and even got some basic interpretation working. But, I had no concept of arrays, so I had to maintain two functions to interpret a string, one for each team. I.e. Move1 and Move2... Good times

It's ok. I implemented a site a search entirely in JS (Ajax didn't exist) for some reason in 1990's.

I have to say I don't understand this.

Tiddlywiki was great because it was a single file, the whole point of tiddlywiki was being a single self-modifying html file. No app needed.

And back when it was created it worked fantastically. Then browser vendors closed a number of 'security loopholes' and TW stopped working as intended.

I understand wanting a modern app-style hypertext-note-taking thing. I don't understand why you'd use TW as a template.

TiddlyWiki still works as intended: https://tiddlywiki.com/#GettingStarted but there are so many different clients to run on. Mobile or Desktop ? What OS? What Browser?

This effort https://val.packett.cool/blog/tiddlypwa/ is remarkable as the mobile side of saving is not as robust as on the desktop side of things and there is a scaling limit on performance as the number of tiddlers grows. Also the syncing between tw documents between different desktop/mobile clients can be a challenge with diffing.

Since then I've moved back to plain vanilla vim for a wiki (map gf :tabe <cfile><CR>) but tw.html is still good for data other than plain text and TiddlyPWA https://tiddly.packett.cool/ is a great effort to revisit TiddlyWiki again.

> I don't understand why you'd use TW as a template.

Probably because tiddlywiki is very close to ideal for certain use-cases. One of the main reasons I switched away from tiddly wiki was I needed better mobile support and syncing was always a monumental pain. Not to mention saving the HTML file was fundamentally broken in modern browsers at the time.

I'm actually using obsidian in essentially the same way I used tiddlywiki so this is VERY interesting to me.

I'd like to see a proper tiddlywiki in an Electron application. The one that exists now is quite ugly and annoying to use. Maybe what I really want is someone to re-imagine TW as something similar to Obsidian (or Obsidian->TW?)

> Then browser vendors closed a number of 'security loopholes' and TW stopped working as intended.

Pardon me, but what are you talking about?

I built my ADHD wiki site on TiddlyWiki. Never knew it was not working as intended:

https://romankogan.net/adhd

TiddlyWiki is great for the reasons you mentioned.

In the first few of years of TiddlyWiki (mid/late '00s), the way it worked was that you just had a local copy of your tiddlywiki.html. You just opened it in a browser, and did your editing. Then you could just click the save button inside the page. And the page was saved to disk. This worked on every desktop browser.

Obviously, generically letting webpages, even local ones, have this sort of access to disk had lots of security implications. So, eventually all browsers removed this functionality. Now, you need all these extensions or tools to save the file.

You can do it with Chromium browsers using the native file system access API. Unfortunately, I think Firefox didn’t actually read the whole spec and Apple doesn’t like it because it cuts into their App Store revenue.

Or you can set it up to make a git commit instead of saving to a local file.

Oh, wow, if you just set up git+https with CORS, then you could push to a git remote from a browser. That's real interesting.

Yep, that's where you get tools like Netlify CMS: https://v1.netlifycms.org/

what was the api like back then that let a webpage write to storage? Was it just calling the browser’s “save webpage” thing? And storing the state in html somehow?

you saved like you can "save page as" now from the browser menu.

That part still works in modern browsers. What broke were the browser extension APIs for automatically saving to the file system without a dialog.

I took a lot and identify with a lot.

But I was wondering how much of this is the effect of the internet on cognition? Specifically in the "ADHD bingo", there are things like "having 50 tabs open" or "forgetting why I was looking at my phone". Isn't that just computers destroying our attention? Or do I have ADHD?

Article expresses that the software evolved since then into a de facto app platform. If so, this new undertaking makes tons of sense.

So it may not be what you knew before. Or it may still be that, but also other new stuff.

But as far as I understand, the 'apps' built on top of the TW platform don't work on the TiddlyPWA. Am I wrong?

Are you saying the author needs to verify that all the plugins built so far are compatible with their own new undertaking, for this to remain True Scotsman TW?

I think it's just a basic question about the tradeoff, if any. It's not that the author needs to verify or support compatibility with TW plug-ins, but it's worth asking because plug-ins provide a value add that's orthogonal to the value add of making TW a PWA.

I was able to get something very similar working for Chromium browsers at https://slaymaker1907.github.io/tiddlywiki/plugin-library.ht.... It doesn’t use a browser plug-in or anything, it’s just Chromium is the only engine to support the native file system access API (Firefox, please prioritize stopping actual Google bologna like the web integrity stuff).

Very serendipitous, I recently made almost the same thing, but for Leo Editor (leoeditor.com) instead of TiddlyWiki. Leo's tree-style organization/UI seems to work perfectly as "second brain" for me, and I've been using it as such for years.

I was getting fed up with not having my notes on my phone, so I finally wrote a mini-Leo PWA, with an equally minimal sync server like in this article. I immediately fully switched to it.

The whole thing is way more crude than this author's though, especially the sync. That's literally implemented as two buttons in the app, "send to server" and "load from server". Better not hit the wrong one :D

I didn't know about TiddlyWiki. Once, I experimented with creating a "decentralized" microblogging platform that carried itself (code+data) in its URL, so it was impossible to censor :) It wasn't a serious experiment of course, but TiddlyWiki's database being its own source code has reminded me of it.

[1] https://github.com/ssg/ourobs

Unrelated but this blog design is great and I love the font they’re using for the body copy!

https://tiddlywiki.com/static/TiddlyWikiFolders.html

This sacrifices the ability to keep your notes as separate files, which is a really undersold virtue of TW run with the node server. If I decide I want to switch away from TW some day, I've got a folder full of markdown files.

If you're on windows, you can give the tiddlywiki file an .HTA extension and it will behave like an HTML app[0]. It does double the filesize due to encoding changes if I'm not mistaken but it works. (And we're talking about text so like... filesize there is cheap).

[0]: https://tiddlywiki.com/static/Windows%2520HTA%2520Hack.html

Noice. Good job. I'm glad to see people still developing for TW. argon2ian is a neat surprise for me as well, assuming I understand it correctly. There's something to be said for keeping tools slim when you want to pack so much into a TW.

It sounds interesting, but what i don't like is the need for a custom sync server. I'd much prefer a WebDAV backend. It's possible, right?

I've got to say I'm not a fan of the selfhosted sync server setup instructions. Passing a URL to deno is feel essentially the same as pipe to bash

Reply on news.ycombinator.com