DEV Community

Cover image for Build an idea generator from scratch, part 4: Speed up the page by caching API results [Video]
Ashley Kolodziej
Ashley Kolodziej

Posted on

Build an idea generator from scratch, part 4: Speed up the page by caching API results [Video]


Hello again folks! This week's installment of the Idea Generator Tutorial focuses on performance and caching. We'll examine cookies and localStorage as possibilities, and how to ensure users still get fresh results periodically even with caching data. We'll also reinforce good programming practices by breaking up our functions into smaller, easier parts to manage and debug.

If you're new to this series, catch up by checking out my post on the first tutorial in this series.

This video covers:

  • How to create localStorage data with expiration times so data stays fresh for returning users
  • The difference between save and save-dev in npm packages
  • How to troubleshoot common errors and importing with ES6 syntax

... and, as usual, a number of other fun tidbits that will help you work more effectively.

The final product

In this series, we’ll be working toward this idea generator as our final product.

Code links

Follow along by cloning or forking the main branch here: https://github.com/ProfessorKolodziej/idea-generator

You can also start on your own project by using my Student Site Boilerplate template: https://github.com/ProfessorKolodziej/student-site-boilerplate/

Catch the new video over here. Happy coding!


I'm always happy to connect!

🐰 @ashleykolodziej on Twitter
🐰 Subscribe to Professor K Explains on YouTube

Sentry blog image

How to reduce TTFB

In the past few years in the web dev world, we’ve seen a significant push towards rendering our websites on the server. Doing so is better for SEO and performs better on low-powered devices, but one thing we had to sacrifice is TTFB.

In this article, we’ll see how we can identify what makes our TTFB high so we can fix it.

Read more

Top comments (0)

The Most Contextual AI Development Assistant

Pieces.app image

Our centralized storage agent works on-device, unifying various developer tools to proactively capture and enrich useful materials, streamline collaboration, and solve complex problems through a contextual understanding of your unique workflow.

👥 Ideal for solo developers, teams, and cross-company projects

Learn more