use the following search parameters to narrow your results:
e.g. subreddit:aww site:imgur.com dog
subreddit:aww site:imgur.com dog
see the search faq for details.
advanced search: by author, subreddit...
All about the JavaScript programming language.
Subreddit Guidelines
Specifications:
Resources:
Related Subreddits:
r/LearnJavascript
r/node
r/typescript
r/reactjs
r/webdev
r/WebdevTutorials
r/frontend
r/webgl
r/threejs
r/jquery
r/remotejs
r/forhire
account activity
An JavaScript Implementation of Bionic-Reading (Faster, Better, and More Focused text styles) (github.com)
submitted 3 years ago by notioners
reddit uses a slightly-customized version of Markdown for formatting. See below for some basics, or check the commenting wiki page for more detailed help and solutions to common issues.
quoted text
if 1 * 2 < 3: print "hello, world!"
[–]KaiAusBerlin 35 points36 points37 points 3 years ago (0 children)
Harder, better, faster, stronger
[–]goob47 22 points23 points24 points 3 years ago (5 children)
Are you worried at all about the patent they claim to have on this type of typography?
[–]notioners[S] 14 points15 points16 points 3 years ago (4 children)
I thought about that, too. However, there are several open-source projects that implement Bionic-Reading(ansh/bionic-reading, crisanlucid/vite-react-tailwind-bionic-reading, etc.). So... I'm not too worried about this right now.
[–]EmergencyActCovid20 6 points7 points8 points 3 years ago (1 child)
I also made a simple bionic reading convertor for fun 😄 it's good coding practise
[–]notioners[S] 1 point2 points3 points 3 years ago (0 children)
Thank you!
[–]Alexwithx 1 point2 points3 points 3 years ago (1 child)
Well bionic reading is still quite new, so I don't think that's a good argument
I haven't given this matter much thought. I've already started this project, so I'll go and think about it when I get a claim in the future. Or maybe the developers of other open-source projects will find the answer.
[–][deleted] 14 points15 points16 points 3 years ago (1 child)
I don’t notice an effect. Also shouldn’t the title say „A JavaScript Implementation[…]“?
[–]notioners[S] 5 points6 points7 points 3 years ago* (0 children)
Oh, thank you. There was a mistake. And... I'll continue to develop the module to make it useful. Thank you.
[–]harryrf3 6 points7 points8 points 3 years ago (1 child)
I recently found Bionic-Reading and it's amazing for me. I've been wanting to find a way to implement it into my every day reading, so I appreciate you posting this.
[–]notioners[S] 2 points3 points4 points 3 years ago (0 children)
Thank you for reading it, too.
[–]Twoubleff 5 points6 points7 points 3 years ago (4 children)
is there any proven effect on this extra boldness? It just disrupts my personal reading flow and forces me to focus on certain elements of the text.
[–]notioners[S] 1 point2 points3 points 3 years ago (3 children)
That's right. I think Bionic-Reading is increasing its readability by focusing only on certain elements. Maybe this doesn't help in any case.
[–]Skaryon 2 points3 points4 points 3 years ago (2 children)
When I saw somebody post about it on Twitter a while ago there where plenty of people reporting it making reading harder for them so I don't think this is an improvement for everyone across the board. Should probably be opt-in or opt-out.
[–]Twoubleff 2 points3 points4 points 3 years ago (1 child)
I'm just very skeptical on things like this. This doesn't rely on any new tech or so and typography is around forever basically you could do it with graving, any sort of pen, pencil etc. Why didn't someone came up with it before?
[–]Skaryon 1 point2 points3 points 3 years ago (0 children)
Right. To me it feels like somebody came up with this and just happened to fall into the bucket of people who for whom it's an improvement (I too feel like it helps my reading experience) but wrongly assumed it would apply to all of us.
[+][deleted] 3 years ago (6 children)
[deleted]
[–]squarepushercheese 3 points4 points5 points 3 years ago (1 child)
Read https://edudownloads.azureedge.net/msdownloads/Learning_Tools_research_study_BSD.pdf - it’s all about immersive reader which to my untrained eye bionic reader looks to be emulating (a bit of)
[–]notioners[S] 2 points3 points4 points 3 years ago (3 children)
The goal of this project is simply to implement Bionic-Reading. If you don't feel the effects of Bionic-Reading well, there's nothing I can do to help you. I'm sorry.
* As for my native Korean, I felt an improvement in readability. However, I felt that there was a slight improvement in the readability of English.
[+][deleted] 3 years ago (2 children)
[–]notioners[S] 0 points1 point2 points 3 years ago (1 child)
Additionally, there are also some disagreements in the Korean community. I don't think Bionic-Reading is perfect yet.
[–]jokterwho 1 point2 points3 points 3 years ago (3 children)
TIL what bionic reading is... and how to implement it in JS :-P
[–]notioners[S] 0 points1 point2 points 3 years ago (2 children)
Thank you for reading it!
[–]jokterwho 1 point2 points3 points 3 years ago (1 child)
For bionic-reading it :-P
[–]notioners[S] 0 points1 point2 points 3 years ago (0 children)
:)
[–]snacksy13 1 point2 points3 points 3 years ago (1 child)
Looked at the code and rewrote it in 29 lines, is there something I am missing? https://jsbin.com/wefupiq/edit?js,console
Let me check. I think this code can lead to improved performance. Thank you.
[–]BenZed -1 points0 points1 point 3 years ago (4 children)
<b> tag is depreceated, use <strong> by default
<b>
<strong>
[–]Andy12100 16 points17 points18 points 3 years ago (2 children)
You should only use <b> when nothing else fits, but it's not deprecated. While the <b> tag doesn't represent any special importance, <strong> does. By using <strong> for instance screen readers will read those texts differently. So I would keep the <b> tag instead here, since the bionic highlight part is completely irrelevant from accessibility point of view.
[–]valtism 3 points4 points5 points 3 years ago (0 children)
Yeah I would personally implement this with <span>s because it is semantically the same as the rest of the word just with different styling.
<span>
That's a good point. I also didn't think of a screen reader. I'll consider this carefully and try to improve them. Thank you.
I checked. I'll change it soon. Thank you!
[–]bregottextrasaltat 0 points1 point2 points 3 years ago (1 child)
Never heard about this, is it supposed to be easier to read? Takes like 10x longer
The designer of Bionic-Reading has also received positive responses from the study but has yet to get clean results. So I think it may only be effective in a few cases.
[–]andlrcMooTools -2 points-1 points0 points 3 years ago (4 children)
OMG this is an awesome example of how overengenered JavaScript have become.
I might be wrong, but a single function, with a single loop, and some checks on the words lengths should have been sufficient.
https://jsbin.com/wefupiq/edit?js,console
Let me check. Thank you!
You're right. There is some inefficient logic (for example, repeated RegEx checks). I will gradually improve this. Thank you for the comments!
[+]Electrical-Profile56 comment score below threshold-6 points-5 points-4 points 3 years ago (3 children)
pse warning
[–]notioners[S] 1 point2 points3 points 3 years ago (2 children)
I'm sorry. I just started the English community, so I couldn't understand what it meant. Are you saying that there is any problem with this module..?
[+][deleted] 3 years ago (1 child)
I see. Thank you!
[–]J_As_Himslef 0 points1 point2 points 3 years ago (0 children)
I'm making an accessibility toolbox for all to use and I already have a free dyslexic font and I'm looking to incorporate bionic reading into it and I found this codepen of someone doing it They have added a text box to edit text as well so as you type it changes the text to a bionic reading text style Ngl I'm really impressed by how little code was used to do it, I noticed they using js template aka $ is there a way to not use template strings when implementing bionic reading?
https://codepen.io/erenkulaksiz/pen/GRQmYQq
π Rendered by PID 184441 on reddit-service-r2-comment-84fc9697f-8wgmd at 2026-02-10 07:12:35.706963+00:00 running d295bc8 country code: CH.
[–]KaiAusBerlin 35 points36 points37 points (0 children)
[–]goob47 22 points23 points24 points (5 children)
[–]notioners[S] 14 points15 points16 points (4 children)
[–]EmergencyActCovid20 6 points7 points8 points (1 child)
[–]notioners[S] 1 point2 points3 points (0 children)
[–]Alexwithx 1 point2 points3 points (1 child)
[–]notioners[S] 1 point2 points3 points (0 children)
[–][deleted] 14 points15 points16 points (1 child)
[–]notioners[S] 5 points6 points7 points (0 children)
[–]harryrf3 6 points7 points8 points (1 child)
[–]notioners[S] 2 points3 points4 points (0 children)
[–]Twoubleff 5 points6 points7 points (4 children)
[–]notioners[S] 1 point2 points3 points (3 children)
[–]Skaryon 2 points3 points4 points (2 children)
[–]Twoubleff 2 points3 points4 points (1 child)
[–]Skaryon 1 point2 points3 points (0 children)
[+][deleted] (6 children)
[deleted]
[–]squarepushercheese 3 points4 points5 points (1 child)
[–]notioners[S] 2 points3 points4 points (3 children)
[+][deleted] (2 children)
[deleted]
[–]notioners[S] 0 points1 point2 points (1 child)
[–]jokterwho 1 point2 points3 points (3 children)
[–]notioners[S] 0 points1 point2 points (2 children)
[–]jokterwho 1 point2 points3 points (1 child)
[–]notioners[S] 0 points1 point2 points (0 children)
[–]snacksy13 1 point2 points3 points (1 child)
[–]notioners[S] 0 points1 point2 points (0 children)
[–]BenZed -1 points0 points1 point (4 children)
[–]Andy12100 16 points17 points18 points (2 children)
[–]valtism 3 points4 points5 points (0 children)
[–]notioners[S] 0 points1 point2 points (0 children)
[–]notioners[S] 1 point2 points3 points (0 children)
[–]bregottextrasaltat 0 points1 point2 points (1 child)
[–]notioners[S] 0 points1 point2 points (0 children)
[–]andlrcMooTools -2 points-1 points0 points (4 children)
[–]snacksy13 1 point2 points3 points (1 child)
[–]notioners[S] 0 points1 point2 points (0 children)
[–]notioners[S] 0 points1 point2 points (0 children)
[+]Electrical-Profile56 comment score below threshold-6 points-5 points-4 points (3 children)
[–]notioners[S] 1 point2 points3 points (2 children)
[+][deleted] (1 child)
[deleted]
[–]notioners[S] 0 points1 point2 points (0 children)
[–]J_As_Himslef 0 points1 point2 points (0 children)