[HN Gopher] Show HN: Unclutter - Reader mode, but better
___________________________________________________________________
Show HN: Unclutter - Reader mode, but better
Hey everyone! In the last months I've been working on Unclutter, a
modern reader mode browser extension. In contrast to all existing
approaches, it unclutters articles by modifying their CSS instead
of extracting the text content. This results in a more visually
pleasing result that reuses the original article style. The idea is
to remove friction so you use the reader mode more often. There are
a few more features around saving articles automatically and taking
highlights -- more details are on the website. The extension has
about 400 active weekly users right now, mostly from organic web
store traffic. Monetisation has proven to be hard and for freemium
there would need to be much higher numbers anyways. Do you think I
should keep working on the project?
Author : phgn
Score : 73 points
Date : 2022-11-23 13:28 UTC (9 hours ago)
(HTM) web link (unclutter.it)
(TXT) w3m dump (unclutter.it)
| catchmeifyoucan wrote:
| Digging this UI. It's actually really beautiful compared to
| regular ol' reader mode. The UI is nice, and it's a cool touch to
| see social comments. Nice work!
|
| I love that you also opened source it! Which is a huge win.
|
| It might also be nice to "auto-activate", so people don't forget
| it's running. Right now, I have to click the extension to run it.
|
| If it could pass paywalls, I'd probably pay ("donate" might be a
| better term).
|
| Any chance you could bring it to iOS as an extension? A lot of my
| reading is also happening on phone
| phgn wrote:
| Hey thank you! I'm really glad you like the extension.
|
| There actually is an "auto-activate" feature you can enable in
| the settings. Is this what you had in mind?
|
| Regarding mobile support, I know. I'm not sure how to handle
| mobile Chrome which doesn't allow extensions, but for Safari
| this should be possible. No guarantees when I can get to this
| though. See https://github.com/lindylearn/unclutter/issues/529
| Whiteshadow12 wrote:
| Tested this on pg essays, the social comments is a pretty cool
| feature, I initially thought you would also surface the
| footnotes, similar to gwern site (one site I doubt I'd ever use a
| reader mode on).
|
| Lovely tool, in terms of things I would pay for, the actual
| reader mode is not really the thing I would pay for. What I would
| pay for would be, highest to lowest:
|
| 1. An awesome search engine that can search text I read, think
| being able to search text on the sites in your browser history,
| there was a service that did this called Memex, and Rewind seems
| like it's trying to do something similar.
|
| 2. Linked texts, e.g PG might say X then Naval says something in
| the same area.
|
| 3. Reminders about articles I read x period of time and might
| want to re read.
|
| I'll think of other features I would be willing to pay for.
| phgn wrote:
| Thank you for the feedback, really interesting ideas.
|
| > _being able to search text on the sites in your browser
| history_
|
| I'm curious, have you used this in Memex when it was still
| supported?
|
| > _Linked texts, e.g PG might say X then Naval says something
| in the same area._
|
| Do you mean direct hyperlinks and backlinks between articles?
| So if the Naval post references a PG essay, you'd see that
| while reading the PG essay?
|
| > _Reminders about articles I [...] might want to re read_
|
| How should it decide which article you want to re-read?
| [deleted]
| dewey wrote:
| This looks very neat, I know it's an edge case (And it's not
| great to build Safari extensions, been there) but do you have any
| plans for Safari support?
| phgn wrote:
| Not an edge case, I've been tracking this for a while:
| https://github.com/lindylearn/unclutter/issues/13
|
| Someone else in this thread suggested a version for mobile
| Safari which made supporting this even more interesting. No
| promises, but hopefully I can get to this before the end of the
| year.
| phgn wrote:
| Here are some past discussions about reader modes, where the
| motivation for this project came from:
|
| _The most underused browser feature: reader mode_ -
| https://news.ycombinator.com/item?id=28286493 - Aug 2021 _(357
| comments)_
|
| _How does Firefox 's Reader View work? (2020)_ -
| https://news.ycombinator.com/item?id=30864311 - Mar 2022 _(102
| comments)_
| clnq wrote:
| I would pay to have something like this that could also summarise
| articles with GPT-3.
| phgn wrote:
| Have you used other services that summarise articles?
|
| What would be the workflow? Do you want to read the summary
| instead of the article, use it to decide whether to read, or
| something else?
| [deleted]
| westcort wrote:
| This bookmarklet does something similar and is browser-
| independent:
|
| javascript:void%20function()%7Bjavascript:(function()%7Bvar%20a=M
| ath.floor,b=document.querySelectorAll(%22p,%20title%22),c=%5B%5D,
| e=%22%22,f=%22%22,g=%22%22,h=0,k=0,l=%22%22,m=%22%22,n=window.ope
| n(%22%22,%22_blank%22);for(var%20d%20in%20b)%7Bvar%20i=b%5Bd%5D.t
| extContent;i%26%26(c=c+%22%5Cn%22+i)%7Dfor(f=c,e=f.replace(/%5Cn/
| g,%22%20%3Cbr%3E%3C/br%3E%20%22),g=e.split(%22%20%22),h=0;h%3Cg.l
| ength;h++)k=a(g%5Bh%5D.length/3)+1,l=%22%3Cspan%20style='font-wei
| ght:bolder'%3E%22+g%5Bh%5D.substring(0,k)+%22%3C/span%3E%3Cspan%2
| 0style='font-weight:lighter'%3E%22+g%5Bh%5D.substring(k,g%5Bh%5D.
| length)+%22%3C/span%3E%20%22,%22.%22==g%5Bh%5D.substring(g%5Bh%5D
| .length-1,g%5Bh%5D.length)%26%26(l+=%22%3Cspan%20style='color:red
| '%3E%20*%20%3C/span%3E%22),m+=l;n.document.write(%22%3Chtml%3E%3C
| p%20style='font-size:40;line-height:200%25;font-
| family:Arial'%3E%22+m+%22%3C/p%3E%3C/html%3E%22)%7D)()%7D();
|
| https://www.locserendipity.com/Hyper.html
| morsch wrote:
| Naturally this required the "Access your data for all web sites"
| permission -- most powerful/useful extensions need this
| permission. But I've been pretty conservative in adding
| extensions with it (as in, just two, including the obligatory
| UBO).
|
| Why isn't there a permission where the add-on doesn't get to
| access anything until I activate it for a specific tab, and then
| it only gets to access to that specific tab? Unclutter would be
| most useful on websites where I'm not particularly worried about
| misuse, but I don't want it to be able to read my emails.
|
| This is not meant as a dig at this add-on or its author, I have
| no reason to believe he's not trustworthy, I think it's a
| limitation of the add-on permission model.
| phgn wrote:
| It's possible for extensions to only get access when you
| activate it for a specific tab. If you want Unclutter to work
| this way you can manually set "Site access" to "On click" in
| the Chrome extension settings (this doesn't work on Firefox
| unfortunately).
|
| The reason I enabled "all sites" by default is to make the
| automatic activation feature work, which used to be more
| powerful. Possibly it can be done with an optional permission
| now, I'll look into it:
| https://github.com/lindylearn/unclutter/issues/527
|
| Thanks for the feedback! Also, if you don't like something you
| can always submit a PR ;)
| morsch wrote:
| Sorry, I should have been more specific, I'm on Firefox. Nice
| that it's already possible in Chrome.
|
| It was intended to be a comment about the limited power of
| the permission model in Firefox, though I have now learned
| from the sibling comment that Firefox actually has the
| permission I was thinking of.
| phgn wrote:
| Yep, but extensions still have to adopt the more
| restrictive permissions.
| simcop2387 wrote:
| I'd also love it if there was one that allowed for additional
| sandboxing. i.e. it can read anything but can never store or
| talk to the network or cause a network call to happen. I know
| that'd be harder to do but it'd also allow for a lot of nice
| add-ons to be made.
| k1m wrote:
| There is an activeTab permission which does this (limits
| access).
|
| Mozilla: https://developer.mozilla.org/en-US/docs/Mozilla/Add-
| ons/Web...
|
| Chrome:
| https://developer.chrome.com/docs/extensions/mv3/manifest/ac...
| morsch wrote:
| That sounds like it's exactly what I want, thanks, very
| interesting.
| cxr wrote:
| "Access your data[...] for a specific tab" basically describes
| what a bookmarklet does (where by "specific tab", you mean "a
| given page--the one loaded in the focused tab when you activate
| the bookmarklet").
| agumonkey wrote:
| add nlp based automatic tagging and i'm set :)
| phgn wrote:
| Tagging for what specifically? What would you use the tags for?
|
| I actually experimented with article topic-prediction for a few
| months, but assignment errors were annoying and it was not
| clear if it's useful at all.
| agumonkey wrote:
| main topic of the page, so you can switfly bookmark it with
| 1-3 tags preset for you. maybe i'm just a unorganized hoarder
| that can't use bookmark to save his life but i wanted to make
| that for years and never got started :)
| phgn wrote:
| Do you use bookmarks right now, and have you tried manual
| tagging?
|
| I believe Pocket premium has AI-suggested article tags.
| Maybe something similar makes sense for Unclutter, but I'm
| not sure of the demand for it.
| kazinator wrote:
| It looks nice! Does it have some paywall-busting powers, like
| Firefox's built-in reader mode?
|
| Quite often, you can get through many a paywall by switching to
| reader mode and then reloading the page. Previously hidden
| content appears.
| phgn wrote:
| Thank you!
|
| Admittedly, paywall-busting doesn't work as well with Unclutter
| as with the text-extraction methods. But it's still effective
| for most sites and there are custom tweaks e.g. for
| nytimes.com.
|
| I'm thinking about improving on this actually. It would be cool
| to fetch the page content from web archives automatically if it
| detects a paywall. Kind of like the "archive.is" links people
| post here all the time, but with less clutter.
| satvikpendem wrote:
| I use the Bypass Paywalls extension [0] for this, and it
| works great with Unclutter.
|
| [0] https://gitlab.com/magnolia1234/bypass-paywalls-chrome-
| clean
| kazinator wrote:
| Is that paywall busting even an actual goal/requirement in
| reader mode, or just a fortuitous side effect of the way it
| does its "web clipping" (is that still a term?)
| phgn wrote:
| It's an intended side effect. The paywall banners are also
| just clutter to remove from the DOM, often the entire text
| is still there.
|
| Technically, messing with paywalls is forbidden for Chrome
| extensions listed in the webstore (and detrimental for
| getting press coverage). Which is why no one advertises
| this.
| enriquto wrote:
| > The extension has about 400 active weekly users right now,
|
| How do you know that? It sounds a bit scary that you are able to
| know this number.
| sabellito wrote:
| I have an addon published for Firefox and they provide usage
| stats, which includes Daily Active Users, despite the addon
| itself having no tracking at all.
| lioeters wrote:
| I was also skeptical at first, but the code is open source, and
| there's clear documentation on privacy policy and metrics
| collected.
|
| https://github.com/lindylearn/unclutter/blob/main/docs/metri...
|
| Bravo to the author, well done for earning the users' trust.
| phgn wrote:
| Yep there is usage reporting (which features people use), but
| it never includes the sites or domains you visit. Beyond the
| project being open-source, it's also bundled so the
| production code is a readable as possible for you to verify
| this.
|
| Honestly the extension would not exist in its current form
| without this. Looking at the usage after releasing a feature
| is incredibly helpful to see if something is working.
| hnthrow10282910 wrote:
| Might just be me, but the example photos (not the first two)
| don't load on the landing page
| phgn wrote:
| Do you mean the example videos with the text next to them? Or
| the 2 rows of images at the very bottom of the page?
|
| They are .webm and .webp. Which browser & browser version are
| you using?
| me_bx wrote:
| For me the videos look like images, both on Firefox and
| chromium on linux.
|
| No play button is displayed, no video playback control bar
| either, and pressing on space bar does not start the video.
| Right-clicking over the video shows a context menu with
| "play" option.
|
| It is confusing to see these as screenshots of the cluttered
| interface and no indication that these are videos.
| phgn wrote:
| Do the videos auto-play for you when they appear?
|
| I made the bad decision of hand-coding the landing page in
| React, do you have a suggestion for a good video player
| component?
| leipert wrote:
| Not the parent, but Safari on iOS. https://caniuse.com/webm
| phgn wrote:
| I just added .mp4 fallbacks, thanks for the tip!
| unsafecast wrote:
| I have no idea if it's related, but on chrome on my phone most
| of the page was solid yellow. Took a while to realize I'm
| supposed to scroll and the things show up.
|
| I don't like this 'trend' of the things appearing with an
| animation as you scroll, I find it irritating and sometimes
| confusing.
|
| Anyway, the problem here seems to be that the threshold is way
| too high, it only triggers when you scrolled the whole content
| away.
| phgn wrote:
| I just lowered the scroll threshold on mobile, does that
| help?
|
| The problem is that the example videos auto-play and can be
| quite distracting if they're visible by default.
| satvikpendem wrote:
| Works great. Only thing I'd include is customizable text and
| background colors. I use an OLED monitor and I'd like to make the
| background pure black rather than simply grey like currently. I
| made a GitHub issue:
| https://github.com/lindylearn/unclutter/issues/537
| phgn wrote:
| Makes sense! Let me know if you want to try implementing this
| :)
|
| How would you expose the setting in the extension UI?
___________________________________________________________________
(page generated 2022-11-23 23:00 UTC)