Skip to content
Menu

Cloudflare Pages vs Netlify: Deploy a Next.js App and Measure Real User Metrics

Learn how to compare hosting platforms, measure user experience, and choose the option that fits your Next.js app and business.

Treat Cloudflare Pages and Netlify as candidates to evaluate, not as automatic winners. Deploy the same Next.js app to each platform, collect comparable user data, and choose based on your requirements, support needs, and operating costs.

Prepare a Fair Comparison

Use the same application for both deployments:

  • Keep the framework, dependencies, environment variables, routes, and assets consistent.
  • Use the same custom domain and caching configuration where possible.
  • Exclude analytics, chat widgets, advertising scripts, and other optional code.
  • Record every configuration change so you can identify what affects the results.
  • Avoid changing the application while collecting data.

Deploy the same project to Cloudflare Pages and Netlify. Use each platform’s standard deployment path rather than adding unusual routing or caching settings.

Choose the Right User Metrics

Evaluate the experience that matters to your visitors:

  • Largest Contentful Paint: How quickly the main content appears.
  • Interaction to Next Paint: How quickly the page responds to interactions.
  • Cumulative Layout Shift: How much visible content moves while the page loads.
  • Time to First Byte: How quickly the server begins returning the page.
  • Error rate: How often requests fail or return unexpected responses.
  • Availability: Whether the deployment responds reliably during the periods your business needs it.

Use field data from real visits when available. Supplement it with controlled checks in different locations and on different devices.

Set Up Measurement

Create a measurement plan before comparing the deployments:

  1. Identify the pages that matter most, such as the home page, product pages, checkout, and account pages.
  2. Define what visitors should see on each page.
  3. Record the result for every metric you plan to compare.
  4. Test authenticated and unauthenticated routes separately.
  5. Repeat checks during normal traffic and under the conditions your site is likely to face.
  6. Keep browser, device, location, and network conditions as consistent as possible.
  7. Save both raw results and notes about unusual events.

A single check can be affected by network conditions or temporary problems. Use repeated checks and user data before drawing conclusions.

Review Performance Without Guessing

Compare each platform using the same pages and measurement process. Pay particular attention to:

  • Slow responses on important routes
  • Layout movement caused by images, banners, or dynamic content
  • Delays after visitors select filters, buttons, or forms
  • Failed requests and error responses
  • Differences between cached and uncached pages
  • Changes after a deployment or configuration update

Do not assume that a deployment platform explains every result. Application code, third-party scripts, images, APIs, and the visitor’s device can have a greater effect.

Ask Each Vendor

Ask Cloudflare, Netlify, and any other shortlisted provider:

  • Which Next.js features are supported for my deployment model?
  • How should I configure caching, rewrites, redirects, and image handling?
  • Where does server-side work run?
  • What limits apply to builds, functions, requests, bandwidth, and storage?
  • How do I view build logs, runtime logs, and failed requests?
  • What happens if a build fails or a deployment is rolled back?
  • Which regions or locations are available to my application?
  • What support options are included?
  • How will pricing change as traffic or usage grows?
  • Can I export logs, data, and configuration if I leave?
  • Which service changes could affect the application?

Request written answers and test the features your application actually needs.

Compare the Operational Experience

Review how each option fits your team:

Deployment Workflow

  • Connect the repository and confirm the automatic build behavior.
  • Verify that the correct environment variables are available in each environment.
  • Test preview and branch deployments.
  • Check rollback procedures.
  • Confirm who can approve and manage deployments.

Application Requirements

List any features your business depends on, such as forms, authentication, server-side functions, redirects, scheduled work, custom headers, or image processing. Test those features instead of relying on general platform descriptions.

Support and Ownership

Document the person responsible for:

  • Application code
  • Hosting configuration
  • Domain management
  • Incident response
  • Vendor support
  • Billing and renewals

Clear ownership prevents a hosting decision from becoming unclear during an incident.

Calculate the Ongoing Cost

Create a worksheet with these headings:

  • Build usage
  • Bandwidth
  • Functions or server-side requests
  • Storage
  • Add-ons
  • Premium support
  • Third-party services
  • Staff time for maintenance

Enter the limits that apply to your plan, but check the vendor’s current documentation before relying on them. Include the work required to operate each configuration, troubleshoot failures, and migrate away if necessary.

Review the worksheet whenever usage, pricing, or application requirements change.

Run a Small Acceptance Test

Before committing, ask each shortlisted platform to support a controlled acceptance test:

  1. Deploy the same release of the application.
  2. Exercise every critical user journey.
  3. Collect results with the same tools and timing method.
  4. Review deployment and runtime logs.
  5. Test a deliberate failure and verify the rollback process.
  6. Confirm that monitoring and alerts reach the responsible team.
  7. Record unresolved issues before making the decision.

Use your acceptance criteria to approve or reject each option. Do not approve a platform because a general feature list appears to cover the application.

Make the Decision

Choose the platform that meets your acceptance criteria with the fewest operational risks. Give priority to:

  • Reliable performance on important pages
  • Compatibility with required application features
  • Clear pricing
  • Monitoring and support
  • Deployment and rollback controls
  • Data and configuration portability
  • The ability to migrate later

Cloudflare Pages and Netlify can both remain on your shortlist until you have comparable results. Record the reasons for the final choice and schedule a review for changes in traffic, pricing, application requirements, or vendor support.