Honeycomb tech post - Next.js Honeycomb Telemetry
Go back...One of the most popular Metaframeworks today is Next.js. I’ve delivered a number of talks on that framework, and so when I came to Honeycomb I realized I needed to do some experimenting and see how far I could take the instrumentation.
So, after digging into React itself, I spent some time working on instrumenting both the client and server side of a Next.js application.
View the blog post on Honeycomb.io.
I hope you find it useful, as it covers self-hosted (not on Vercel) Next.js services. If you need any assistance, please reach out to us for office hours.
I have provided a basic GitHub Repository to experiment with at github.com/krimple/honeycomb-fullstack-nextjs-demo as well.
Previous presentations
I did a survey talk at PhillyETE in 2024, and a talk in 2023 on Next.js and Remix.run can be viewed on YouTube.
For additional background, check out my presentations on Metaframeworks, which is the classification that Next.js falls into.
What is a Metaframework?
The term ‘Metaframework’ is a recently coined one, and represents frameworks that run on top of more basic or general frameworks or libraries, and coordinate them with both client and server needs.
The most popular Metaframeworks today are Next.js, Remix.run and Nuxt, and you could argue that Gatsby.js is another in that same vein, though Netlify has been focusing some efforts on merging it with Netlify’s engine.
All of these Metaframeworks provide a number of key features:
- Client-side components
- A file-based router
- The ability to load the application from any routable page
- Server-side rendering of components
- Static page generation / incremental static generation (some frameworks)
Many of these frameworks support additional features such as optimized components for resizing and caching images, importing one-off client scripts such as Google Analytics, loading fonts, handling forms, and more.