Show HN: Hacker News user experience enhancement browser extension | Hacker News Reader

Show HN: Hacker News user experience enhancement browser extension

carina.app

153 pointshnux84 comments

Hello everyone!

This is a browser extension that attempts to enhance Hacker News user experience, while your data is kept secure, and private (never leaves the browser).

Browsers have evolved significantly since doing a v1 back in 2010, which was one of the contributing factors, for attempting a complete re-take few months ago.

Personally, I was surprised how useful it turned out to be when browsing around HN.

On the linked page you can find install link(s) from web-browser stores, and demo video/screenshots of the features[1]

What do you think ?

[1] including, browsing content with multiple columns, infinite scroll for lists, user profile tooltips, dynamic comment reply, dark-mode, ...

Open articleView on HN

Typing this using the extension. I like it, through I think one of the reasons I like browsing HN is that the website is intentionally very simple / I don't have to think around navigation at all (everything is very linear, I click something I get a page reload with the thing I'm expecting). This adds just a bit more cognitive load around navigating.

I'll keep using it for a bit to give it a fair shot however since I can imagine the split pane being super useful in certain cases.

One thing I noticed is that pressing `edit` does not let me edit anymore. It just opens my post on the left pane (and still isn't in edit mode) so my only option to add this feedback is to reply to myself :)

You are right actually.

It's a bug, that missed my test somehow.

Will fix.

Same thoughts here. I think it's great that people can make extensions and apps for new and varied experiences, but the current HN is dang near perfect IMHO. Simple, intuitive, fast, does what you expect it to do. Nothing less nothing more. It's reached its final form for me. Everything else is fan fiction.

"dang near perfect" is correct!

The only issue is the font, really. I use the stylus extension to change it to:

* { font-family: Open sans; }

And _now_ it's perfect. For desktop at least.

And each post opened, because it's on it's own page, is in a single-thread-focus-mode. And so is your post as I'm writing this reply to it.

> This adds just a bit more cognitive load around navigating.

I think you'd like "Refined Hacker News". It provides thoughtful, convenient enhancements but doesn't change the core HN experience.

https://github.com/plibither8/refined-hacker-news

Great extension. I use it heavily. The problem is that the developer seems to have given up on it.

You'll need this PR to use it without errors: https://github.com/plibither8/refined-hacker-news/pull/125

Interesting, I'm using is as-is from Chrome Web Store¹ and haven't seen problems. Thankfully it's open source in case a fork is ever necessary.

¹ https://chrome.google.com/webstore/detail/refined-hacker-new...

You don't 'see' the problems unless you know what to look for. One sign is that the spinner in the top left corner doesn't end. Check the console for errors too.

The primary issue is that the DOM parsing fails due to changes in the HTML structure and the extension throws NPE's.

Oh! Yes, then I do see this. Thank you for the pointer to the PR and the explanation.

I've been collecting thoughts on the next generation extension to make for HN. Hopefully when I have a bit more time (in the middle of a giant home remodel), I'll find some time to implement it. One core thought that I really enjoy about this extension is that it doesn't really change the UI/UX at all, it just refines it. I think that is important.

Hi. I see no information about a privacy policy, so I'm asking directly: Who are you and how do we know we can trust this extension?

Why are the last reviews from 2012 to 2014?

I'm asking, because people posting tools here usually have a link to a GitHub profile and I can't find any information on who created this extension. Something like https://chrome.google.com/webstore/detail/georgify-plus/epgj...

Other than that, thanks for this tool. Apparently it only requests access to HN, so it should be safe.

> how do we know we can trust this extension?

The extension adheres to the best practices, and like you said requests only access to HN. Manifest v3 is designed such that should an extension change its permission requirements, it must engage the user to decide, thereby being obvious.

> I see no information about a privacy policy

Sorry for that. I can post one in the next weeks.

> Why are the last reviews from 2012 to 2014?

The comments are from v1 which was released back in 2010. Although it continue to worked, v1 was practically out-dated and probably didn't encourage anyone to comment.

v2 was released in February 2023.

Thank you for taking the time to answer the questions.

For what it’s worth, I’ve also got a Chrome Extension to improve the HN experience.

It’s also using manifest v3 if that’s a selling point, and has light and dark modes.

https://chrome.google.com/webstore/detail/georgify-plus/epgj...

I like the idea but I uninstalled it because it made everything too big. I'm using a 2022 mbpro with small text and it totally screw the scale of original HN.

Without the extension i can see 26-27 feed articles and with it is just 7-8, I think you still make it show the original 22-23 as HN leaves a lot of spaces on the sides.

edit: Here are some imgs to show https://imgur.com/a/WddNttU. As you can see original HN leave enough space for your new features without any need to rescale things

Hi.

Thanks for trying it out.

I can certainly provide font-size customisation in-app, but for now one could adapt the font-size in their liking with browser's zoom capability (ctrl+ or ctrl - key combination).

Yeah it definitely improves with zoom out, i just dont like the idea of having custom zooms per page but thats just being very picky me.

Also, have you thought of supporting the custom hn top bar color? I think you get that setting after some karma and ppl change it, for me is not a big deal but it may be something people want to keep.

Also just noticed that the chrome link preview that appears when hoving over a link comes on top of your menu since its aligned to the left. Maybe having it aligned to center as the header bar makes more sense?

> i just dont like the idea of having custom zooms per page

I understand. It's just a workaround for now.

> have you thought of supporting the custom hn top bar color?

Thanks. I will add support for it in the next update.

Hmm, it doesn't really solve. You removed all margins and when zooming out you get a screen really full of content.

Zooming out to ~65% at the browser level makes it a lot more usable for me

I appreciated the increased text size. Have had a setting for HN at 120% font size because I have trouble reading the small default size. Can't please everyone I guess?

I don't know if it will fix your font size problem, but this is what I have in my userContent.css for Firefox:

    @-moz-document url-prefix(https://news.ycombinator.com) {
      body {
        background-color: #d4d4cb;
        margin-top: 0;
      }
    
      #hnmain {
        max-width: 960px;
      }
    
      .title {
        font-size: 1.5rem !important;
      }
    
      body, td, input, textarea,
      .default, .admin, .subtext, .yclinks, .pagetop, .comment, .hnname {
        font-size: 1rem !important;
      }
    
      .comhead {
        font-size: 0.8rem !important;
      }
    }

Using rem units means it respects the font size defined in my Firefox configuration. The rest is mostly about avoiding ultra wide content.

Why is your HN topbar blue?

Are you better than me or something!? Harumph.

When you get 500 karma you can change your top bar background color.

Refined Hacker News [1] is similar extension with some really useful features, which was on the front page a few months ago.

[1]https://github.com/plibither8/refined-hacker-news

You'll need this PR to use it without errors:

https://github.com/plibither8/refined-hacker-news/pull/125

this strongly reminds me of circa-2011 4chan enhancement scripts, in a really good way, right down to the column approach. makes me nostalgic for when the mainstream considered “unobtrusive javascript” viable & scripting/dynamism by and large felt like enhancements to websites

then somehow we arrived at pulsating placeholder bars for 40-byte `text/plain` XHRs & hamburger menus & “i resized my browser to half screen width and now the website treats me like an ipad”

thanks for the taste of yesteryear; it was very sweet

There's some interesting ideas here, like the column approach, inline comment replies, etc. However, this note:

>Hacker News UX is an early adopter of Manifest V3 which imposes stricter security to extensions.

I have to comment on that, as the Google line on MV3 being about security irks me a bit. In this case, the extensions loads for all urls with news.ycombinator.com/* and injects it's own build.js content script. It doesn't appear to do anything terrible, but it could if it wanted. It could keylog, exfiltrate data, steal your password, make HN posts on your behalf in the background, etc. Manifest V3 does nothing to police content scripts. Largely because many extensions need those kind of permissions to do anything useful.

This extension only requests access to HN's known domains.

If one would try to request to a non white-listed domain it would trigger Access-Control-Allow-Origin error.

Also I think v3 makes it quite hard to use remote loaded code.

Any attempt to be malicious would probably be caught by store's review process eventually.

Yeah, I'm not saying this extension is doing anything nefarious. I am saying that Google's propaganda about MV3 isn't right, and it's obviously spilling out to other people. MV3 blocks one specific api call in OnBeforeRequest()...the one that's useful mostly to ad blockers. The remote loaded code restriction is laudable, but the review process is weak. It's fairly easy to get shady things approved.

Manifest V3 prohibits extensions from loading any remote code like JavaScript or Wasm files[1].

1. https://developer.chrome.com/docs/extensions/mv3/intro/mv3-o...

Right, I acknowledged that in the comment you're replying to. But the review process is weak. And, I don't need to load external code to exfiltrate stuff. For example, I can load an image with a specific name/path, or hijack functionality already on the page, like Google Analytics code. Generally, non-trivial extensions cannot be both secure and useful at the same time.

I use HN a lot, but not sure I can use this. While user profile tooltips and inline reply authoring would be nice, I'm struggling with the typographic choices, it feels a lot harder to visually parse, and most of what I'm doing on HN is reading.

Did you get a chance to try it ? I do a lot of reading it too, and felt benefited from it.

Can I ask what specifically was hard to parse ?

I can also provide preferences for any recommendations you may have, that can benefit one. Will add the font-size change for example, as commented elsewhere.

Also, dark mode is more suitable for low light conditions, and does make reading much easier.

I did try it. Only for a few minutes, but I felt it was enough to get a sense of the typography/layout.

I think my main issue was font size and lack of whitespace. I'm typically reading 10-12pt fonts in docs, code, and body content on web pages. HN by default is close to that. I think I'm therefore used to that and find it the easiest size to scan content in – I'm not reading every word I'm skimming through quickly a lot of the time.

That's also where whitespace can help. When skimming I found the page to be a mess of text with little separation. More whitespace, more contrast between different types of text, etc, could do a lot to make the page more easily readable.

One thing that I do find annoying with HN is the long text lines. I'd love to be able to wrap paragraphs at a relatively small width – this typically aids reading and comprehension, and it's why most publishing websites limit content width even on wide monitors. This could also be related to the layout issues I have with this extension – My browser window is currently ~2000x1900px, and it seems the content expands continually with no limit. Maybe there could be a limit to aid readability?

I find content much harder to read in dark mode and don't use it. It strains my eyes with the contrast and I find it harder to focus. I appreciate some people like it but I think it's a personal thing and important to have both options.

Thank you. I will see how I could use your insights.

Good idea. Though I can't understand the choice of Serif font (Ubuntu Chrome). Also the dark theme makes the page look like uniform stream of text. I think it lacks some accent color here.

I didn't test on Ubuntu. But can do. Thanks.

The extension uses HN's default font 'Verdana', which is in sans-serif family, and that font is probably not available on your Ubuntu machine ?

I don't think I need the two-column layout, but I really wish HN supported that dark mode! Without an extension, that is. It looks beautiful.

Just installed it, works flawlessly on Orion Browser (WebKit that can use Chrome & Firefox extensions).

Off the bat, I like the two column view with infinite scroll. I also like the bigger text size, although it could be just a tad smaller.

My only real complaint is I no longer have my custom header color -- I liked the splash of color it added!

Thanks for confirming it works in Orion too, that nudged me to try it.

Thank you!

Typo in the landing page, I assume "EXLORE FROM LISTS" was supposed to be "EXPLORE"

Thank you.

With HN, medium is the message as well

Another alternative that hasn't been brought up yet is https://www.modernhn.com

While we're on an "alternatives" thread, https://hckrnews.com/ is my daily driver.

Honestly, the only UX enhcncement I'd like to see on HN desktop website is this:

* Limit the display length of individual text groups to be 60-80 characters.

Everything else is grand.

Could you please be more specific about your recommendation ? Which text groups ?

I'm calling the following a "text group":

1. A singular comment

2. For a text submission such as Ask HN, the post contents

A general readability recommendation is to limit your line lengths to be around 45-80 (e.g. [1]).

For websites that just have a singular main body of text (e.g. blog posts, articles), this is easy to do with css rules.

The text on HN comments page is of a bit different nature. Each child comment cascades, there's an indent. So to apply the typography rule of "not too many characters in a line, one would have to apply the css rules per text group*. Effectively a child comment is still getting wrapped with the same column width, not lower.

[1]: http://webtypography.net/2.1.2

Thanks I will reread your comment later. I actually agree with that.

Although not hard limit, if you open HN with the extension on, you can then adapt the window size, and the content width will be around that limit;

That's how I do it for now.

Is it possible to get something like this on a mobile browser or even better a decent Hacker News app that you can reply in

Hack is pretty good on Android. Replying from it right now.

Play Store: https://play.google.com/store/apps/details?id=com.pranapps.h...

Another point for my favourite HN mobile client. HACK is also available for iOS on the App Store: https://apps.apple.com/us/app/hack-for-hacker-news-reader/id...

My one point of feedback is that when you see the quickview of the user, it shows their karma. Part of the reason people enjoy HN is because Karma is not a huge focus. This extension puts it right at the forefront. I would much rather show a snippet of their "about".

I like it!

I went a step further and made my own client[0] so that it’s easier to navigate on larger screens and mobile, but could not find a good solution to support logging in. An extension is a great middle ground.

0. https://modernorange.io

Dark mode and a more legible thread view were all that HN needed. https://images4.imagebam.com/8d/d3/45/MEL9537_o.PNG

Man, I’d love to find a simple Safari extension to make the HN’s font slightly larger and enable dark mode in iOS without the need to use another app.

Is this technically possible? If so, I might go ahead and code this myself ^^

There's probably several different extensions that do the same thing, but this is what I use Cascadea[1] for.

[1] https://cascadea.app

That's only for MacOS. I meant something like that but for iOS. Any ideas?

I installed it and I figured out that:

1. when I click on comments, it takes time to load the content on the right side 2. I feel like there is a lot of information at the same time in front of me

I find HN design really simple and good IMO

my wishlist for HN is toggle-able lines up to connect thread parents / GP, etc - kind of how notepad++ highlights the parent DIV..

thing is I get a few page scrolls down into threaded comments and find that I am not going to read all the back and forth holy war on one particular nit.. but I want to scroll rest of page to see if other topics are brought up - but it's easy to get lost on the up and down scroll and just give up trying to sort where the forks in the road went off the rails.

Maybe this or something else mentioned here does this - not sure.

I dont actually see this listed on the FF add-ons store. Can anyone link?

The one "feature" I want added to hn is to remove the "hide" button. I literally never want to hide anything (why would I?), and I often fat finger it on mobile

I'm assuming you're using some secondary extension for the dark mode shown in the video?

One suggestion - can you make it so the splitter bar allows resizing from the right or left?

> I don't see an option to toggle dark mode

You must hover over your username, or login, link, in the bottom-left corner, and a pop-up window should appear with the option to switch to dark-mode.

> can you make it so the splitter bar allows resizing from the right or left?

Thanks. Can do.

Any word on when Firefox would be ready? I love the split panes

If you don't comment, https://hn.premii.com works pretty good without extension or anything.

Funny how many browser extensions there are. After installing the "related" section at the bottom showed me 16 other Hacker News enhancement extensions.

Why not a Safari extension? A bunch of us are on Macs. No hate; just wondering if Apple has made it too onerous to fool with.

I think it's wise to ask for opinions before putting time towards supporting os-specific browsers.

> just wondering if Apple has made it too onerous to fool with.

It seems to be fairly straightforward, assuming the creator is interested: https://developer.apple.com/documentation/safariservices/saf...

Thank you for the suggestion.

I will look into it when I could add support for it sometime in June. It should be possible to run without difficulties, as also noted by CharlesW.

Looking forward to giving it a try in FireFox.

The multi column layout makes me wonder how it would feel to have an embedded reader-mode view of the linked page in HN.

woah this looks good appreciate making new UI components similar to the HN style

Thank you!

When is the Firefox version going live? Would love to try it out.

Thanks.

I submitted the extension to Firefox Add Ons store. Will post when it becomes available.

Please add an automatic archive.ph checker pls for adblocked/paywalled sites, and rewrite urls to automatically go to the archive

When you open a comment thread, the upper part of the scrollbar is hidden behind the header. You have to scroll down a bit to be able to see and drag the scrollbar thumb. This on Chrome on Windows.

Reply on news.ycombinator.com