SEO Metrics for developersOptimize pre-deployment

VSCode Logo with a link to download Next Engine Optimization on VSCode marketplaceDownload NEOGitHub Logo with a link to Next Engine Optimization's GitHub RepoContribute to NEO
Next Engine Optimization Demo GIF of Opening NextJS Project

About

What is Next Engine Optimization?

Activating Next Engine Optimization in the command palette

Next Engine Optimization (NEO) is an Open Source VSCode extension meant for Next.js developers to retrieve technical SEO metrics such as First Contentful Paint, Largest Contentful Paint, and Hydration time. The idea was brought to life when our team identified that a lot of tools meant for retrieving SEO metrics was usually only meant for deployed applications, and we wanted to allow developers to optimize their SEO during development. Leveraging SSR and NEO together provides the abilty to launch websites fully optimized for any search engine.

Get Started

1. Open an App Router based NextJS Project with the src directory

Next Engine Optimization Demo GIF of Opening NextJS Project

2. Install ‘NEO Metrics’ from the VSCode Marketplace

Next Engine Optimization Demo GIF of Opening NextJS Project

3.In the command palette, enter ‘Activate NEO’

Next Engine Optimization Demo GIF of Opening NextJS Project

4. Start your server and input Your localhost address and port (e.g. http://localhost:3000)

Next Engine Optimization Demo GIF of Opening NextJS Project

5. Right Click Any Folder with a valid page.tsx, then click NEO:Generate Metrics, and Behold

Next Engine Optimization Demo GIF of Opening NextJS Project

Our Team

Image of Tom Nguyen

Tom Nguyen

Software Engineer

GitHub Logo with a linkLinkedIn Logo with a link
Image of Justin Shim

Justin Shim

Software Engineer

GitHub Logo with a linkLinkedIn Logo with a link
Image of Nitesh Sunku

Nitesh Sunku

Software Engineer

GitHub Logo with a linkLinkedIn Logo with a link
Image of Donald Twiford

Donald Twiford

Software Engineer

GitHub Logo with a linkLinkedIn Logo with a link
Image of Benson Zhen

Benson Zhen

Software Engineer

GitHub Logo with a linkLinkedIn Logo with a link
next.js icon