Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

iTechGuides is reader-supported. When you buy through links on our site, we may earn an affiliate commission. As an Amazon Associate I earn from qualifying purchases. Learn more

Keeping a headless WordPress site current requires two separate mechanisms: an API that lets the frontend read content, and a change signal that tells its cache which data or pages to refresh. The WordPress REST API or WPGraphQL handles delivery; a webhook or equivalent event pipeline triggers targeted revalidation in the frontend.

When those jobs are designed together, a published post can update its detail page, archives, menus and related listings without rebuilding the entire site. When either job is missing, editors can see a successful publish in WordPress while visitors continue to receive an older cached response.

What “in sync” means in a headless WordPress architecture

In a traditional WordPress theme, publishing and rendering happen in the same application. A headless setup separates them. WordPress remains the editorial system and stores posts, pages, media, taxonomies and custom data. A separate frontend—often a JavaScript application rendered statically, on the server, or at the edge—fetches that data and maintains its own caches.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

That separation creates two independent questions:

  • Can the frontend retrieve the current representation? It needs a supported API route, the right fields, and appropriate authentication.
  • Does the frontend know when its cached representation is obsolete? It needs a notification and an invalidation policy.

An API request by itself does not invalidate a static page or a cached data request. Conversely, a webhook that fires without a reliable data fetch can trigger a rebuild that still stores incomplete or unauthorized content. Treat content access and freshness as separate contracts, then connect them with an observable event path.

#1 Best Overall
Sale
Compressed Air Duster,130000RPM Super Power Cordless Air Duster,Rechargeable Brushless Blower,3 Gear Adjustable Blower with LED Light,Dust Remover for Computer/House/Outdoor/Car
  • Powerful Turbo Fan:CAGIWIRU Electric Air Duster have reached speed up to 130000RPM,Can efficient remove dust and debris.With LED light and Three Adjustable Speed to meet with different cleaning tasks.
  • With Attached USB C Fasting Charging cable.Charing 3 hours,Enjoy up to 240 minutes of use on the lowest setting, For third speed can use for 25mins.with four charging options to meet with your needs.
  • Wide Application: attached 5 different nozzles,making it suitable for a variety of scenes, such as car,pet, pc, keyboards, and other electronic devices. It also serves for office and home clean duster.
  • Handy Design & Portable:Cordless air duster electric nozzle is Light weight and small size, design and comfortable to hold and space saving, convenient to carry around. You can put it in your room or inside the car without taking up space.
  • Economical &Reusable: Built durable materials with a long-lasting battery,our CAGIWIRU air duster it's a sustainable alternative to disposable air cans.

Choose how the frontend reads WordPress

WordPress REST API

The core REST API sends and receives JSON objects, as described in the WordPress REST API Handbook. Standard routes cover posts, pages, media, taxonomies and other resources. The exact namespaces, post types, fields and permissions depend on the individual site, so a client should discover the installation rather than assume that every WordPress site exposes the same routes.

Use the REST API discovery process and check the REST API reference for the routes and namespaces that the site advertises. A custom post type may be absent, read-only, or exposed under a name different from the one used in the WordPress editor.

WPGraphQL

WPGraphQL adds a GraphQL schema so the frontend can request a precise selection of fields and relationships. Its documentation explains the schema and extension model at WPGraphQL Docs. GraphQL can be a good fit when a page combines nested data—such as a post, its author, featured image, taxonomy terms and related content—in one query, but it requires the schema and any custom fields to be configured and maintained.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

Decision matrix

Consideration REST API WPGraphQL
Availability Built into WordPress core; confirm routes and namespaces on the target site. Requires the WPGraphQL plugin and any extensions needed by the schema.
Request model Resource-oriented JSON endpoints; clients may make several requests for related data. One query can select nested fields and relationships, subject to the schema.
Fields and content types Depends on core, registered post types and REST exposure settings. Depends on registered GraphQL types, field resolvers and extensions.
Authentication Public resources are generally anonymous; private resources require authentication or explicit exposure. See REST API Authentication. Use the authentication and preview approach supported by the GraphQL installation; do not expose private data in a public query.
Best starting point A site that needs a standard, core-supported API with straightforward resource requests. A site with complex relationships, a team comfortable with GraphQL, or extensions built around a GraphQL schema.
Performance claim Neither approach is universally faster or easier. Measure the actual queries, caching and hosting setup.

Do not select an API solely because it is fashionable. Inventory the content types, fields, preview requirements, installed extensions and team skills first. The API choice also affects how you identify changed entities and how your cache layer can purge them.

Model cache dependencies before writing invalidation code

A changed article rarely affects only its own URL. A post may appear on a home page, a category archive, an author page, a search result, a “latest” feed, a navigation menu or a recommendation block. A taxonomy rename can affect every route that displays that term. A media replacement can affect a post, an image rendition and an image-heavy listing.

Create a dependency map that answers, for each WordPress entity, which frontend data and routes depend on it. Use stable identifiers rather than titles or slugs alone:

Rank #2
EVEO® Screen Cleaner Spray Kit (Streak-Free) TV Screen Cleaner for Smart TV, Lcd, LEd, Oled | Computer Screen Cleaner Spray and Wipe Microfiber Cloth - TV, Monitor, Laptop, iPad, Car - 6.7oz 1 Pack
  • Screen Cleaner is Your Screen’s New Bestfriend! - EVEO is proud to present a screen cleaner that’s perfectly suited for your TV. Meet your new screen cleaner, computer screen cleaner, laptop cleaner, iPad cleaner, Macbook,tv cleaner or any other electronic device. Our screen cleaner spray and wipe along with the included plush microfiber cloth, easily removes dust, fingerprints & other smudges on the screen’s surface. Clean effectively for a streak-free screen
  • Gentle on your Screens - Our screen cleaner spray and wipes is compatible to be used even for the most sensitive LCD, LED, CRT, and OLED screens in proper use. Be at ease knowing that this product is compatible with all the major brands: LG, SONY, Samsung, Sharp, iPad, iPhone, Android screens, Kindle, PC monitors - we’ve got you covered! Can be used as LCD screen cleaner, tv cleaner, smart tv screen cleaner, and more
  • Premium Super Soft Plush Microfiber Cloth - Included in this efficient screen cleaning kit. This screen cleaner spray and wipe has our signature plush microfiber cloth specially designed to comply with screens and monitors and leave them streak-free. Has been shown to effectively absorbs stubborn stains, zero streaks, and no fiber shedding. Always use this together with our screen cleaner for the best results
  • Easy-to-Use Screen Cleaner Kit + microfiber cleaning cloth - The EVEO Screen Cleaning Kit will easily be your new favorite tool when it comes to taking care of the things you love most, quick and easy solution for a streak-free screen. Simply screw on the sprayer gun on the screen cleaner bottle. Spray the cleaning liquid onto the microfiber cloth, then wipe the screen until desired cleanliness & shine is achieved.
  • Quality Screen Care Kit Worth Purchasing - Enjoy a convenient Screen Cleaner anytime, anywhere you need it. Your satisfaction is our top priority. We stand behind the quality of our products and that’s why, you shouldn’t be worrying at all. We manufacture the Best Screen Cleaner. and can be used for laptop cleaning kit, laptop screen cleaner, tv screen cleaner for smart tv. MacBook screen cleaner, monitor cleaner or screen cleaner spray for electronic devices with microfiber cleaning cloth
  • Entity tags: for example, a post ID tag, a taxonomy-term tag and a menu tag.
  • Collection tags: tags for a post type, archive, feed or query shape.
  • Route paths: the canonical URL and any known archive or landing pages that must be refreshed.
  • Custom-data tags: identifiers for custom fields, tables or external records that the page reads.

Keep the mapping in one documented module or service. If a post is fetched by numeric ID in one component and by slug in another, associate both cache keys with the same content identity. Include locale, site section or tenant in a tag when those dimensions can produce different responses.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

Core event listeners may not know about every custom data lifecycle. The WPGraphQL Smart Cache extending guidance specifically notes that custom data may require custom purge events. Apply the same principle to REST-based systems: when a plugin or custom table changes data used by the frontend, emit an explicit change event or schedule reconciliation for it.

Send a change signal from WordPress to the frontend

Use an event endpoint, not frontend polling alone

Polling WordPress on a fixed interval can eventually detect a change, but it leaves a predictable stale window and creates requests even when nothing changed. The WPGraphQL Smart Cache on-demand revalidation documentation describes an event-driven pattern: its graphql_purge action can drive a webhook that tells a frontend which pages to rebuild. Static frontends using incremental regeneration commonly use this kind of notification.

For a REST implementation, connect the WordPress publishing and content-management events available in your installation to a server-side endpoint. The event should identify the operation and the affected entities; it should not ask the public browser to perform the purge.

Define a small, explicit payload

An event payload should contain enough information for deterministic invalidation and logging. An illustrative shape is:

What’s actually slowing this PC down?

Pick the symptom - the matching free tool is one click away.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.
{
  "event": "post.updated",
  "entity": "post",
  "id": 842,
  "slug": "example-slug",
  "status": "publish",
  "changed": ["title", "content", "featured_media"],
  "tags": ["post:842", "archive:news"],
  "paths": ["/news/example-slug"]
}

The field names are an application contract, not a WordPress standard. Keep the contract versioned, reject unknown or malformed operations, and make processing idempotent so a retried notification produces the same result as the first one.

Rank #3
Sale
BladeHawks RGB Gaming Mouse Pad Extra Large Extended 31.5x12 Inch-Black | LED mouse pad with 14 lighting modes, covers keyboard & mouse, anti-slip rubber base, waterproof surface, USB powered
  • 【Large size】:Measuring 800 x 300 mm/ 31. 5×12 inches, which is wider and taller than others. Large mouse pad can perfectly fit your keyboard and mouse of any size, and there is also ample space for peripherals such as phones, tablets, etc.
  • 【LED backlight mouse pad】:Blade Hawks RGB mouse pad provides 7 static modes and 7 dynamic modes will give you the options you are looking for. Power-off memory function remembers the last lighting mode you selected. The super glow fiber Chroma will give you a colorful gaming setup that you want.
  • 【Anti-slip rubber base】:Made from Natural rubber, this gaming mousepad will firmly grip your desktop, allowing you to enjoy the ultimate precision in the games you are most passionate about. It also comes with a texture that enhances this ability even further.
  • 【Smooth and waterproof surface】: Micro-textured cloth surface, for extremely precise mouse control and a smooth movement. When liquid splashes on the gaming mouse pad, it forms water droplets and slides down. Will not delay your work or gameplay.
  • 【Plug and play】: This mouse and keyboard pad is powered by USB, plug and play, no driver required. One button control light modes. Press one time to change the lighting mode, press twice to change the brightness, press and hold about 3 seconds turn ON/OFF.

Protect and validate the endpoint

  • Accept requests only over HTTPS and authenticate the sender with a secret, signature or another mechanism appropriate to your deployment.
  • Validate the event type, entity identifier, status, tags and paths against an allowlist. Never accept arbitrary cache keys from an unauthenticated caller.
  • Limit request size and rate, and return a clear success or failure status so the sender can retry transient errors.
  • Log a correlation ID, the received event, the invalidation result and any downstream error without logging credentials or private content.
  • Keep the endpoint server-side. A browser-visible endpoint that can purge arbitrary paths is an application-state vulnerability.

The cited event documentation demonstrates the purge-and-webhook pattern but does not prescribe one universal authentication scheme. Choose controls that fit your hosting platform and threat model.

Apply the right revalidation strategy in the frontend

Time-based revalidation

Time-based revalidation refreshes data after a configured interval. It is simple and can provide a safety net when an event is delayed, but content may remain stale until the interval expires and a request causes the refresh. Use it when a bounded delay is acceptable or when a source cannot reliably emit events.

On-demand revalidation

On-demand revalidation runs because a change event arrived. It can make publishing appear quickly without rebuilding unrelated pages, but it depends on delivery, authentication, invalidation and the next data fetch all working correctly.

Free tools Windows power users keep installed

One-click scans. No signup required.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

Tags versus paths in Next.js

The current Next.js revalidation documentation describes invalidating cached data by tags or routes by path. It recommends tag-based invalidation when practical because a tag can represent a shared data dependency across many pages. Path invalidation is useful when the affected route is known and its cache association is not.

Method Use when Important behavior
Tag invalidation Several routes depend on the same post, taxonomy, menu or query result. Invalidates data associated with the tag; choose tag granularity carefully to avoid refreshing too much or too little.
Path invalidation The event identifies a concrete route such as a post URL or archive. Invalidates route data for that path; include redirects, localized paths or related listings when they also depend on the change.
Time-based refresh A delay is acceptable or a fallback is needed. Refresh occurs after the interval and on a subsequent request according to the installed caching model.

Next.js APIs evolve with the framework’s caching model. The current documentation distinguishes stale-while-revalidate behavior using revalidateTag with a cache profile from immediate expiration using updateTag, which is available only in Server Actions, and documents revalidatePath for route data. Check the documentation that matches your installed version before copying an example.

Implementation walkthrough

1. Inventory what the frontend reads

  1. List every WordPress resource the frontend requests: posts, pages, media, taxonomies, menus, options and custom data.
  2. Record the API route or GraphQL query, the authentication mode, and whether the response is cached.
  3. List every route that renders each resource, including home pages, archives, feeds, search, author pages and shared navigation.
  4. Mark which routes are public, preview-only or personalized.

2. Verify API discovery and permissions

For REST, inspect the site’s discovered namespaces and routes rather than assuming a default installation. Confirm that the required post types and fields are exposed. For GraphQL, inspect the schema and test the exact query used by the frontend. Test anonymous access separately from authenticated preview access.

Rank #4
Sale
Vaydeer Wrist Rest for Keyboard and Mouse, Computer Ergonomic Wrist Support Pad, Soft Memory Foam Arm Cushion for Desk, Palm Hand Office Laptop Typing
  • 【Softer and More Comfortable】Vaydeer wrist rest has unique diamond pattern, which is the combination of softness and aesthetics. The materials of wrist rest are improved into higher quality memory foam and covered with silky smooth lycra. The computer wrist rest makes you as comfortable and cushiony as like rest your wrists on clouds.
  • 【Ergonomic Wrist Saver】The wrist rests for keyboard and mouse comes with a 17.32×3.15×0.83 inch keyboard wrist pad and a 5.94×3.15×0.83 inch mouse wrist support. Based on ergonomic design, the unique concave shape is the perfect fit for your wrist joints. The wrist rest pad fits most computer keyboards and laptops, improve hand and wrist posture, release your wrist and arm stress.
  • 【Non-Slip Rubber Bottom】Featuring an anti-skid silicone base on the bottom, this wrist keyboard support stays firmly in place on your desk, preventing the padding from sliding around, ensuring stable and consistent wrist support during extended computer sessions.
  • 【Better Experience & Pain Relief】Our keyboard arm rest is beneficial to alleviate the soreness caused by direct contact and friction between your arm and a hard desk surface, reducing the risk of wrist fatigue or carpal tunnel. The soft texture of memory foam can evenly distribute the pressure around your wrists and provide good support with just enough give.
  • 【Helpful in Multiple Scenarios】Whether you're working, studying, writing, typing, gaming, this keyboard and mouse rest combo is an essential accessory to add comfort and support to your hands and wrists. It’s also a great gift for men, women, family, friend, coworker, gamer, teacher, etc.

3. Establish canonical identities and tags

Choose a canonical identifier for each entity, normally the WordPress numeric ID, and map slugs and URLs to it. Define tags for individual entities and shared collections. Document which event changes each tag. This prevents one component from purging post:842 while another stores the same data under an unrelated key.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

4. Connect WordPress events

Configure the event source to cover creation, updates, publication, unpublication, deletion, slug changes, taxonomy assignment, media changes and relevant custom-field or custom-table changes. If you use WPGraphQL Smart Cache, its documented graphql_purge action is one event source for the webhook pattern. A REST-only site may need a plugin or custom integration that emits an equivalent event.

5. Implement the server-side receiver

The receiver should authenticate and validate the request, translate the payload into your approved tags and paths, perform invalidation, and return a retryable error when invalidation fails. Keep it independent of the browser so a visitor cannot forge a purge request.

export async function POST(request) {
  const suppliedSecret = request.headers.get('x-revalidation-secret');
  if (suppliedSecret !== process.env.REVALIDATION_SECRET) {
    return new Response('Unauthorized', { status: 401 });
  }

  const event = await request.json();
  if (!Number.isInteger(event.id) || typeof event.event !== 'string') {
    return new Response('Invalid event', { status: 400 });
  }

  // Map the validated event to approved tags and paths here.
  // Call the revalidation functions supported by your installed Next.js version.
  return Response.json({ accepted: true });
}

This is a deliberately incomplete framework example: the authentication header, event schema and mapping must match your deployment, and the invalidation calls must match the Next.js version and runtime you operate.

6. Invalidate all affected dependencies

For a post edit, invalidate the post tag and every collection or route that displays the changed fields. For a slug change, invalidate both the old and new paths if the old URL can be cached or redirected. For a taxonomy change, invalidate the affected term, the post’s detail page if its taxonomy display changes, and all relevant archives. For a menu edit, invalidate every layout or page that embeds that menu.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

7. Fetch again and verify the rendered result

After invalidation, make a request that exercises the same path a visitor uses. Confirm that the frontend performs a new API or GraphQL fetch and that the response contains the changed value. Test through every cache layer—application, CDN and browser—rather than checking only an internal function’s return value.

Best Value
Sale
Under Desk Cable Management Tray No Drill, Metal Mesh Cable Management Under Desk with Clamp Mount, 2 Hole Cable Tray with Wire Management and Cord Organizer for Home Office Standing Desk
  • 【No Drill Mounted】Cable management tray can be assembled in as little as 3 minutes or less-simply. Side clips easily clampe the edge of desk, pass through the holes on the sides, and secure excess cables with baskets. Desk cable management supports inward or outward installation to meet your needs in different scenarios, and provides you with great convenience when collecting and organizing wires.
  • 【Rubber Pad Protects Desk】Wire organizer under desk built-in soft rubber pads on the clamp protect your desk from scratches, so you will not damage your furniture or office.
  • 【Sturdy and Beautiful】Cord management under desk is made of high-quality carbon steel and holds about 15 lbs. The wire basket has 2 holes on each side of the tray to enable your cables to pass freely. Cable baskets are suitable for desk thickness use from 0.4" to 2.4".
  • 【Space Saving & Keep Organized】Desk cable management tray holds all your power cords, outlet strips, USB hubs and computer transformers hidden from your feet, and the data cables will not enter the vacuum cleaner to keep your desk clean and tidy. Desk wire organizer is also suitable for use in the kitchen and outdoors.
  • 【Reduce Safety Risks】Cable tray under desk keeps all plugs away from your kids, no more worry about tripping. Using 2 holes wire tray saves extra space, helps you easily cabling and wire protection. The mesh design is not easy to accumulate dust, but avoids safety accidents caused by messy wires.
Independent reader supportYour contribution helps us test, update, and keep practical guides available for everyone.Support on Ko-Fi

Cover the publishing and deletion edge cases

Change What to invalidate Common failure
Create and publish New detail path, post/entity tag, feeds, archives, search and any “latest” component. The detail page works, but a listing remains cached.
Edit title or body Entity tag plus every route that renders the changed fields. Only the canonical article URL is refreshed.
Unpublish or change status Entity, old public path, archives, feeds and search results. A previously public page remains visible from a cache.
Delete Entity, old path, listings, related content and redirects as applicable. The API returns not found, but a static page still serves the deleted content.
Change slug Old and new paths, entity tag, archives and redirect data. The new URL is fresh while the old URL serves stale content.
Change taxonomy assignment Post, old and new term pages, affected archives and navigation labels. The post moves, but one category page still lists it.
Replace media Media tag, image variants and every page that embeds the asset. HTML updates but an image CDN key still points to the old file.
Change custom data Tags and paths for the custom field, table or external source. Core listeners do not observe the custom lifecycle.

Deletion and unpublishing deserve explicit tests because a missing object can be cached just as easily as an old successful response. Decide whether the frontend should show a 404, a redirect or a deliberate “ no longer available” page, then invalidate the corresponding cached response.

Handle public content, previews and private data separately

WordPress distinguishes generally public REST data from private content. Public resources are commonly accessible anonymously, while private resources require authentication or explicit exposure. Do not make a private post public merely to simplify static generation.

Public rendering

  • Fetch only fields intended for anonymous visitors.
  • Cache the response at the appropriate layer and tag it with its content dependencies.
  • Ensure that error responses and authorization failures are not cached as if they were valid public content.

Preview rendering

Preview requests need a trusted path from the editor to the frontend. The REST authentication documentation describes cookie authentication with nonces for a user logged into WordPress. That mechanism is designed for logged-in WordPress contexts; do not assume it is the correct credential flow for a separate production frontend. Use short-lived, least-privilege preview credentials or a signed preview request appropriate to your architecture, and keep preview responses out of public caches.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.
  • Mark preview requests so they use a private or bypass cache key.
  • Validate the post ID, preview token, expiration and requested origin.
  • Prevent draft content from being returned when the token is absent, expired or invalid.
  • Clear preview cookies and tokens when the user exits preview mode.

Webhooks and private information

Webhook payloads should contain identifiers and change metadata, not post bodies, unpublished text or credentials. A purge event should tell the frontend what to fetch, not become a second content-delivery channel.

Diagnose a page that still shows old content

  1. Confirm the source: Check the WordPress editor status and query the API or GraphQL endpoint directly with the same visibility and authentication as the frontend.
  2. Confirm event creation: Look for a notification generated at publish, update, unpublish or delete time. If no event exists, inspect the WordPress integration and custom-data hooks.
  3. Confirm delivery: Check the receiver’s authentication, HTTP status, timeout and retry logs. A successful editor action does not prove that the webhook arrived.
  4. Confirm mapping: Verify that the payload’s entity ID, old and new slug, taxonomy and custom-data identifiers map to every required tag and path.
  5. Confirm invalidation: Inspect the frontend logs or cache provider to see whether the intended tag or route was invalidated.
  6. Confirm the next fetch: Request the page after invalidation and verify that a new API or GraphQL response was obtained.
  7. Check other caches: Purge or bypass CDN, reverse-proxy and browser caches only after fixing the dependency map; otherwise the same defect will return.

This end-to-end check matters because revalidation is not proof that a visitor received fresh content. Freshness is established only when the WordPress change, notification, handler, invalidation and subsequent data fetch all succeed.

Use reconciliation as a safety net

Keep a periodic refresh or reconciliation job even with event-driven invalidation. It can compare a lightweight WordPress change signal, modified timestamps or a known set of critical routes and repair missed events. Set the interval from your acceptable stale window and infrastructure budget: shorter intervals reduce detection delay but increase API and rendering work.

Record event IDs, receive times, processing duration, invalidated tags and paths, retries, and final verification results. Alert on repeated failures and on events that remain unprocessed beyond the agreed freshness target. A small, durable event log is more useful than a dashboard that reports only that the webhook endpoint returned HTTP 200.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

Practical launch checklist

  • REST namespaces and routes or the WPGraphQL schema have been discovered and tested on the actual site.
  • Public, authenticated and preview requests return only the fields appropriate to each audience.
  • Every frontend route has a documented list of WordPress dependencies.
  • Entity, collection, taxonomy, menu and custom-data tags follow one naming convention.
  • Create, update, publish, unpublish, delete, slug, taxonomy, media and custom-data events are covered.
  • The event receiver authenticates callers, validates payloads, limits input and is idempotent.
  • Tag and path invalidation behavior matches the installed Next.js version and caching model.
  • Old paths, redirects, archives, feeds, search and shared navigation are included where relevant.
  • Preview responses cannot enter public caches, and credentials never appear in payloads or logs.
  • Retries, dead-letter handling, reconciliation and freshness alerts are in place.
  • A test proves the complete path from an editor change to the next visitor request.

Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on Amazon at the time of purchase will apply.