Show HN: Hacker News user experience enhancement browser extension

carina.app

153 points by hnux a year ago

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, ...

frde a year ago

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.

  • babbledabbler a year ago

    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.

    • avel a year ago

      "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.

  • frde a year ago

    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 :)

    • hnux a year ago

      You are right actually.

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

      Will fix.

  • CharlesW a year ago

    > 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

    • latchkey a year ago

      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

      • CharlesW a year ago

        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...

        • latchkey a year ago

          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.

          • CharlesW a year ago

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

            • latchkey a year ago

              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.

  • tapland a year ago

    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.

qwertox a year ago

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.

  • hnux a year ago

    > 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.

    • qwertox a year ago

      Thank you for taking the time to answer the questions.

jiwidi a year ago

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

  • galdor a year ago

    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.
  • hnux a year ago

    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).

    • jiwidi a year ago

      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.

      • jiwidi a year ago

        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?

      • hnux a year ago

        > 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.

    • jeanlucas a year ago

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

  • Y-bar a year ago

    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?

  • frde a year ago

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

  • NiloCK a year ago

    Why is your HN topbar blue?

    Are you better than me or something!? Harumph.

    • cloudking a year ago

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

0x69420 a year ago

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

tyingq a year ago

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.

  • hnux a year ago

    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.

    • tyingq a year ago

      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.

      • xd1936 a year ago

        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...

        • tyingq a year ago

          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.

danpalmer a year ago

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.

  • hnux a year ago

    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.

    • danpalmer a year ago

      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.

      • hnux a year ago

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

enbugger a year ago

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.

  • hnux a year ago

    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 ?

Reason077 a year ago

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.

AndroidKitKat a year ago

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!

  • freediver a year ago

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

  • hnux a year ago

    Thank you!

reportgunner a year ago

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

  • hnux a year ago

    Thank you.

thejackgoode a year ago

With HN, medium is the message as well

butterNaN a year ago

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.

  • hnux a year ago

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

    • butterNaN a year ago

      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

      • hnux a year ago

        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.

yukinon a year ago

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".

stefanvdw1 a year ago

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

messutied a year ago

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 ^^

  • ctippett a year ago

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

    [1] https://cascadea.app

    • messutied a year ago

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

bapetel a year ago

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

stevenicr a year ago

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.

notesinthefield a year ago

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

wheybags a year ago

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

nirav72 a year ago

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?

  • hnux a year ago

    > 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.

vaughnegut a year ago

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

nemacol a year ago

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

TheRealDunkirk a year ago

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.

  • hnux a year ago

    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.

  • tapland a year ago

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

UI_at_80x24 a year ago

Looking forward to giving it a try in FireFox.

agumonkey a year ago

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

cloked a year ago

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

  • hnux a year ago

    Thank you!

PrayagS a year ago

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

  • hnux a year ago

    Thanks.

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

99112000 a year ago

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

gavaw a year ago

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.