PRNext 0.1.17: developer tools and persistent caching

#Development tools inside your page

The menu on the floating PRNext logo gives you access to the console and inspection tools. Client and server messages share a view that you can filter by source and level. Requests, routes and compilation measurements help you investigate a slow refresh or a page that fails.

Phone and tablet previews give the application the corresponding viewport dimensions. Its own media queries determine the layout. You can change the orientation without recreating the displayed session and scroll supported content by dragging the pointer.

Panels load on demand, while message capture starts early enough to retain startup logs. You can move the indicator to another corner or open the console and device previews in a separate window.

#Give your assistant the component context

Choose Select element for AI, then select an element on the page. The inspector finds its location in the code and can attach the file, line, relevant code, computed styles and a screenshot to your request. Your assistant has an identified component to help it understand the change you want.

Connect Codex, Cursor, Claude or another compatible client using the MCP configuration provided by the tools. Once submitted from the panel, the context is available for the assistant to retrieve from your development session. Copying the configuration prepares the connection; exchanging context and verifying changes require an active connection.

After making a change, the assistant can check that the browser is actually displaying a new compilation. The result distinguishes an observed correction from a failed or inconclusive check. Project permissions continue to apply throughout this work.

#Compile the routes you open

A large project can contain many pages when you only use a few of them. PRNext compiles requested routes with their layouts, error components and dependencies. A reverse index in Rust connects changed files to the open routes that depend on them.

If two open pages share a header, editing that header recompiles the affected parts of both pages. A page that has not been opened can wait until its first visit. Middleware, custom handlers and uncertain dependencies still use a full compilation.

Persistent transformations also avoid repeating valid work after a restart. Development and production builds keep separate caches. Reuse depends on the content and compilation settings; a missing or invalid entry is simply recompiled. These caches store compiler work, not personalized application responses.

#Adjust your styles while keeping page state

You can adjust spacing, colors or typography around a form you have already filled in. A compatible CSS change publishes new styles without rebuilding JavaScript or restarting the application worker. The browser keeps its document and React state while applying them.

Each generation's stylesheet files remain immutable, so a tab can finish loading its assets without their contents changing along the way. A change to CSS Modules exports, Sass or custom processing can affect more dependencies and returns to the full compiler.

#Less repeated work in the Rust engine

Indexed dynamic routing and the pstart proxy reduce the work around the application worker. Accepted HTTP connections disable the delay for small packets. Persistent connections continue to support streaming and allow requests in progress to finish.

Assets reuse their validated gzip and Brotli files. The compression cache index avoids rescanning the entire directory whenever files are published, and bundle analysis can reuse compressed sizes that are already known.

Prerendering independent production routes uses a limited number of workers. This prepares several routes without creating a process for every page, while preserving request isolation, deterministic output and the ordering required by error pages.

#Prepare the next worker during compilation

The next development worker can start preparing while compilation is underway. It takes over once ready, after readiness checks and an authenticated handoff. The previous worker has time to finish work in progress.

Compiler recycling responds to memory pressure, sustained growth and a session limit. It replaces the automatic restart every 24 compilations. When early worker preparation is unavailable, the normal startup path is used.

#Compatibility and diagnostics

Use .ts or .tsx for TypeScript modules that carry a React server or client directive. Unsupported .mts and .cts boundaries are rejected before the build is activated, both in source code and after transformation by a loader. Ordinary TypeScript helpers remain supported.

To investigate a refresh issue, prnext dev --safe uses full compilations with fresh compilers. It disables persistent transformations and early worker preparation while retaining compatible Fast Refresh. Diagnostics identify what triggered the work: opening a route, editing code, changing configuration or updating CSS.

Next.js compatibility remains partial. Check the pages, forms, Server Actions and integrations specific to your application in the production build.

#Update and try the new tools

Version 0.1.17-alpha is available on npm. From your PRNext project directory, update the package and restart the development server.

npm install @thomas.f/prnext
npx --no-install prnext dev .

Open the address shown in the terminal, then open the menu on the floating PRNext logo. Choose Client console to examine messages, Inspect for page information, or a Phone or Tablet preview to test your layout.

To work with your assistant, choose Select element for AI, select a component and open the configuration for your client. Copy the provided MCP settings into your client, keep the development server running and wait for the tools to confirm the connection. Describe the change in the panel and choose Send context to AI, then ask your assistant to use that PRNext context.