DEV Community

Pipat Sampaokit
Pipat Sampaokit

Posted on • Updated on

Poor Man's Bionic Reading

I find that Bionic Reading is super cool. But their Chrome extension is not quite pleasant to use.

So I create a quick extension. But the algorithm is not as complex as the original one. This extension simply "bionifies" 60% of word length.


function bionifyText(text) {
  const words = text.split(/\s+/);
  return words.map(bionifyWord).join(" ");
}

function bionifyWord(word) {
  const wordLength = word.length;
  const numBionifiedCharacters = Math.floor((wordLength * 60) / 100);
  const bionifiedToken = word.slice(0, numBionifiedCharacters);
  const theRest = word.slice(numBionifiedCharacters);
  return `<b>${bionifiedToken}</b>${theRest}`;
}
Enter fullscreen mode Exit fullscreen mode

How to use

  1. Clone the repository
  2. Open Chrome and go to chrome://extensions/
  3. Enable Developer Mode (probably at the top right corner)
  4. Click "Load unpacked" and choose the repository root directory
  5. Open any website, highlight the text you want to bionify
  6. Right click, choose "bionify", and boom!

How to customize

Change the implementation of the function bionifyWord in bionify.js however you like, go back to chrome://extensions/ and click the reload icon

Example Usage

example usage

Top comments (0)