Posts in Pwa (2 found)
David Bushell 1 months ago

Croissant Favicons and Tauri Troubles

Croissant v0.4 is out! I fixed a few minor bugs and added favicons. I’ve had a surprising amount of feedback. I wasn’t expecting anyone to care about an app I designed for myself. Thanks to all who managed to navigate my contact form . Croissant’s design philosophy is vague because I’m just making it up as I go along. Essentially it’s an experiment in keeping it simple. Not “MVP” because MVP is nonsense — and not “minimalism” because that does not mean good. Croissant is just basic and unbloated. The three most requested features have been: Folders is never going to happen, sorry! That would literally double the codebase for a feature I’d never use myself but have to maintain. Bookmarks is possible. Croissant is just a reader not an organisation tool but I see the value of “read later”. Not sure how this will work yet. I do not want to build a bookmark manager. Favicons has happened! When I declared “no icons” I was talking about the craze of UI icons everywhere . Icons without labels! Meaningless béziers from self-important designers that leave the rest of us saying “WTF does this button do?” Favicons actually serve a purpose and improve the design. Favicons are a simple feature but were not easy to implement. Tauri is causing me headaches. I’m starting to rethink if I should continue the native app wrapper or focus solely on the PWA . The web platform always wins. How many cautionary tales must I read before I accept the truth! Why am I wasting time debugging Tauri and Apple’s webview for issues that don’t even exist in Safari? Wasted time and energy. I’m accruing non-transferable knowledge in my (very) limited brain capacity. Croissant v0.4 might be the last native macOS version. It only exists because the PWA requires a server proxy (CORS) that has privacy concerns . Maybe I can add a “bring your own proxy” feature? Podcast feeds include an image tag but basic RSS does not. There are standardised ways to provide an image/icon with and web manifests . These both require parsing the website’s HTML to discover. I’m relying on “known” root locations; namely: These locations aren’t required for either icon but browsers check there by default so it’s a good place to guess. For the 200-ish blogs I subscribe to I get a ~65% success rate. Not ideal but good enough for now. I really want to avoid HTML spelunking but I may have to. Expect an improvement in the next update. For now a croissant emoji is used for missing icons. I’m using the Offscreen Canvas API to generate a standard image size to cache locally. Favicons are currently cached for a week before refreshing. First I tried using a service worker to cache. Tauri was not happy. Second I tried using OPFS with the File System API. Tauri was not happy. I dumped Base64 into local storage and Tauri was OK with that but I wasn’t because that’s horrible. Finally I went back to IndexedDB which is perfectly happy storing binary blobs. So you can see why Tauri is on thin ice! I don’t want tech choices dictating what parts of the web platform I can use without jumping through non-standard hurdles. That’s all for now. I hope to have another update this year! Visit CroissantRSS.com to download or install Croissant as a progressive web app. Oh yeah… and I kinda messed up deployment of the PWA service worker so you may need to backup, remove, and reinstall… sorry! Thanks for reading! Follow me on Mastodon and Bluesky . Subscribe to my Blog and Notes or Combined feeds.

html HTML Pwa design Design web-development Web Development
0 views
kytta 2 years ago

The UX fail of PWAs in Safari 17

After a hiatus caused by me writing my bachelor’s thesis, I have finally got time to blog again. And, would you look at that, WWDC just kicked off! Naturally, I’ve got thoughts to share. Let’s discuss the boring stuff out of the way first: Vision Pro is gimmicky and creepy, and I didn’t even believe the rumours that it would be announced. With that out of the way, let’s talk about what got me excited the most: PWAs in Safari on macOS! Yup, that’s how boring I am. Contrary to what many of the people I know say, I really like the idea. Don’t get me wrong: I hate browser-based apps. I want my applications to be native and quick, without tons of JavaScript, and I want them to interact with the system in the most native way possible. But if there is something I hate more than web apps, it’s Electron-based web apps. I hate having to run a Chromium instance and a Node.js runtime for every app that uses it. It’s a waste of resources, and it doesn’t make sense. Sandboxing is cool, but various versions of Chromium taking gigabytes on my disk aren’t. Tauri makes the situation better, but it will take a while before major applications will adopt it instead of Electron. Meanwhile, large portions of these apps are available in-browser: Figma, Notion, Slack, etc. So, why not just use the browser versions of the apps? Let’s be real: we’ve lost this war. There is no way web-based ‘native’ apps will ever die out. But, the introduction of PWAs and lots of new Browser APIs can make the installing and deleting of web apps easier and without requiring lots of space. Now, back to Apple. If you’re old enough (disclaimer: I’m not), you remember the Apple of the past—when Steve Jobs was still CEO—, and the legends of him personally trying out every product of the company and rebuking the developers and designers for every small inconsistency. These times are long gone; I mean, just look at the System Preferences app from Ventura. The introduction of Catalyst was a big mistake, up to the point where Flutter apps feel more natural than the ones from iPadOS. As Marques Brownlee summed it up very nicely on Hot Ones: Steve Jobs was a product guy, Tim Cook is a supply chain guy. And yet, even with lowered expectations I have for Apple’s new software products, I still can’t wrap my head around the simplest usability improvement of PWAs in Safari 17 that was left out. Let’s revisit the WWDC keynote: When I click Add, the icon instantly appears in the dock. Now I can close this window in Safari. When I launch my web app, [...] Did you catch it? Now, maybe I’m wrong about this, but if I add a web app to dock, that means that I have made a decision to use it as a standalone app. So, why do I have to then close the tab and re-open the app separately? For me, it makes no sense and breaks my workflow, too. Chrome (if you enable PWAs) does it correctly: upon installing a web app, it moves the currently open tab to a new window instance of the standalone app, and I can continue working there without losing my data. Something tells me that the ‘good old Apple’ and Steve Jobs would not let it slip through, let alone be explicitly shown in a keynote. And this is not that much to ask, either. Think about Quick Look: Have you ever noticed that, when you open a Quick Look preview of a PDF document and then click ‘Open in Preview’, the Preview window will open exactly at the same spot where the Quick Look one was? Don’t rush to check this for yourselves, as they’ve somehow broken it in the last macOS releases. But this is exactly the continuity and seamlessness that I would expect from Apple and their software. I guess, this has become too much to ask for. This is post 006 of #100DaysToOffload .

frontend Frontend javascript JavaScript web-development Web Development dart Dart Pwa
0 views