LEHMAMIC
LEHMAMIC
BlogAbout
CODE
TYPESCRIPT

Implement reading time for your blog articles

Michael Lehmann
Michael Lehmann1 November 20222 min read

I recently implemented a small hint showing the reading time of an article in my blog. This is a functionality use quite much when reading some technical articles written by the developer community. It helps me to decide whether I have the time to read an article just now or if I'm going to put it on my stack. So I thought it would be nice to provide my readers the same flexibility.

According to Medium the reading time is based on the average reading speed of an adult (roughly 265 words per minute).

To get a basic implementation of this I could get rid of the Markdown markings and count the words by splitting the string by spaces. Images add additional time to the reading time and this approach would not consider that.

Luckily I found a nice npm package reading-time which does this form me. It can handle plain text, html and markdown.

All I need to do is installing the package.

npm install reading-time --save-dev

And use it to convert my markdown content to an estimated reading time

import readingTime, { ReadTimeResults } from 'reading-time';

const result = readingTime(post.content)

The result contains several properties. I can get directly the text 3 min read by accessing result.text or alternatively the reading time as a time result.time, in minutes result.minutes and the word count result.words.

At the end, it was very simple for me to integrate an estimated reading time into my blog.