Riffing on Scott Jenson's Splitter
Scott Jenson built a single page thread splitting interface, and I overcomplicated it
cott @jenson.org has been digging into a lot of different UX experiences, including lots of work with operating systems and evolving the desktop UX.
Scott recently dug into making a thread posting interface for Bluesky, called Splitter. It's beautiful designed (of course!) with thoughtful way of splitting. He also set himself the constraint of a single file and no build step for JS.
He mentioned that app passwords were "more secure" and I had to jump in and say that they are convenient (you don't need to implement OAuth, which can be tricky especially for his approach of a locally run, no build step, simple HTML file with javascript included), but they do also give "god mode" access to the account.
OAuth has the benefit of being able to issue scoped access -- e.g. just posting bsky posts -- and doesn't need any configuration on the part of the user: it's the same flow as a more complex hosted app.
Additionally, atproto has a particular exception for its OAuth implementation, which is that 127.0.0.1, your localhost address, can be used as an OAuth endpoint, without needing https.
I took it as a fun constraint (single file HTML with inline JS and no build step), and forked Scott's repo to add OAuth support and make it an installable PWA. You do need to run a small Python web server to make this work, which he also mentions as an option.
I have my own Journal Editor on my personal site, and threads is something I hadn't implemented yet, although I do have previews and handle support and a bunch of other things. I also, a long time ago, wrote up a similar concept that was originally Twitter targeted Threadstorm Builder.*1
So after adding OAuth and PWA support, I worked on a few other features:
- Rich text support for handles / links / hashtags*2
- Handle support using @zzstoatzz.io's Typeahead
- Link previews
- "pinning" a link preview card so you can delete the URL in the body text
- Quote posts with preview
- After posting, start a new thread, or continue posting in the existing thread*3
A few selected screenshots of features as I was working on this.
OAuth Sign In
What you can see here is that the app is "on my device" because it detects the 127 IP address. And that it only has "Create Bluesky Posts" permission.*4
PWA Install
New Thread or Continue
Inline Link Previews*5
The README has the full list of features, including all of Scott's original work on smart splitting.
The Atmosphere loves themes
Things escalated*6, and where Scott had Bluesky prominently displayed everywhere, I wanted to highlight Atmosphere, plus a couple of the major microblog apps like Blacksky and Eurosky's Mu. So of course, a themes layer.
Scott's original interface is really nicely designed, and was a pleasure to work with. What I've done here isn't "better", it just inspired me to work on this. I hope this is at least interesting, feel free to fork it and make your own customized
I've got it hosted it at splitter.bmannconsulting.com on Github Pages*7 so that you can also install it as a PWA on mobile.
Is this the future of apps and malleable software?
I mean, no, it's an evening of poking at a codebase*8 from someone with knowledge of what's possible who has explored the space before, building on very nicely designed foundations that makes it look better than average.*9
And it's Just Code. And Just Github. Not malleable in any sense of the word.
But...we can just do things.
I kept it with GH Pages because that's where Scott started.
Especially with things like themes, "forking" should be visual and iterative, rather than code focused.
I think Bluesky's Attie should lean into this*10. It can host things from your PDS and make them forkable, and create a standard for the whole industry.
And, of course, lexicons and a rich text facet system lets us create new things in a way that are compatible. And with OAuth, some safety rails.
Nota Bene*11
- Threadstorm was more about making the difference between a blog post and threads collapsed - threads should be long form blog posts in many cases! These days I tend to go the other way - make a blog post and then announce it / turn it into a thread with relevant parts highlighted. ↩
- One of the things I love in my journal editor and before that Ouranos is out-of-band tags because IMO hashtags in the body just don't look very nice. They are a strong part of Mastodon posting because it's the major way of doing discovery across servers. ↩
- Storing "old threads" in local browser storage, so you can go back and keep appending to a thread would be another thing ↩
- In this context, a "Bluesky post" doesn't mean "on Bluesky the app", it means the microblog post format that Bluesky has defined with a lexicon. It will say this even when you're targeting Blacksky or Eurosky's Mu, or anything else that supports the short post format. ↩
- Yes, the open graph images on my site are a giant pic of my avatar, I really do need to fix that. ↩
- We're at like feature number 9 now, so whatever the superlative of "escalated" is. ↩
- I spent some time searching for a Glitch-like deploy system. ↩
- Poking being shorthand for saying using Paseo hooked up to OpenCode powered by Umans French inference provider running DS 4.1 Flash v1017. Affiliate link to get low cost not US based tokens from Umans. ↩
- The themes drop down list is jarring. Anything bad is my fault, everything good is thanks to Jenson. ↩
- "This" being customizing and hosting sites. Scott's single page is a great example, and of course Attie could make using atproto OAuth a core feature. ↩
- There are a lot of asides. I regret nothing. ↩
Did you enjoy this article?
Recommend it — Standard Reader surfaces well-loved writing to more readers across the network.