NitroPack and Cloudflare's Automation Platform Optimization (APO)

What Is Cloudflare Automatic Platform Optimization (APO)?

Cloudflare APO is an optimization service that distributes your website HTML and third-party fonts intelligently across the globe using the Cloudflare edge servers.

It caches dynamic content (HTML) on Cloudflare’s edge servers, bringing it closer to your visitors. Usually, if you're using a CDN like Cloudflare, static resources like images, JavaScript, and CSS are loaded faster since they are saved at locations geographically closer to the visitor, but the HTML does not. Requests still need to fetch the HTML from the origin server to load anything, which can be very helpful in lowering the time to first byte (TTFB).

Cloudflare APO is available for all paid Cloudflare plans with no additional fees. The Free plan offers the APO for a $5/month fee.


Does Cloudflare APO work with NitroPack?

The short answer is yes.

The Cloudflare APO works with NitroPack, and we recommend it to our clients if they are experiencing high TTFB on their websites.


How to set up Cloudflare APO for your website

1. Navigate and log in to your WordPress wp-admin area.

2. Select Plugins > Add new.

3. In the search field, enter Cloudflare.

3. Locate the Cloudflare plugin and select Install now.

image5.png

5. After the plugin finishes installing, select Activate. The Cloudflare plugin now displays in your Plugins list.

❗6. To properly work with NitroPack and to ensure the best possible performance, please make sure to activate the "Cache By Device Type" setting.

image12.png


How to connect Cloudflare APO with your WordPress website?

To create the connection between your WordPress website and Cloudflare APO, you will need to create an API token which can be done via your Cloudflare dashboard. After this, the token should be added to your WordPress.

1. Open your Cloudflare dashboard.

2. Select My Profile from the top of the page.

3. Select API Tokens > Create Token.

image8.png

4. Locate WordPress from the list and select Use template.

image10.png

5. Select Continue to summary at the bottom of the page.

6. On the WordPress API token summary page, select Create Token. This will display your API token.

image4.png

7. Select the Copy button to copy your token. You will need to paste the token in the next section.

image3.png

➡️ After that, add the Cloudflare API token to WordPress.

1. Open your WordPress account and navigate to Plugins.

2. Locate the Cloudflare plugin and select Settings.

3. Select the option to sign in with an existing account.

image7.png

4. Enter your email address and paste the token you created into your Cloudflare account.

5. Select Save API Credentials.

6. In your WordPress Dashboard, find Apply Recommended Cloudflare Settings for WordPress, and click Apply.

image6.png

7. In your Cloudflare account for Automatic Platform Optimization, switch the toggle to On to enable APO.

image9.png


How to verify that APO works

You can check if you have set up correctly your Cloudflare APO by reviewing your website headers.

Open your WordPress site, right-click on the page, and select Inspect. This will open your browser inspector.

image2.png

The other way to access the inspector is by going to View > Developer > Developer Tools in the Chrome menu bar.

image1.png

Click on the request to your domain (your website name in the example below). 

In the submenu, click “Headers” to display the HTTP response headers.

image11.png

When APO is properly configured with the Cloudflare WordPress plugin, the headers match the below.

CF-Cache-Status |HIT

  • The cf-cache-status header displays if the asset is served from the cache or was considered dynamic and served from the origin.

Cf-Apo-Via | tcache

  • The cf-apo-via header returns the APO status for the given request.

Cf-Edge-Cache | cache, platform=wordpress

  • The cf-edge-cache headers confirm the WordPress plugin is installed and enabled.

📌 If you need any assistance or have questions, you can always reach out to our support team at support@nitropack.io or via this link: https://support.nitropack.io/hc/en-us/requests/new

Was this article helpful?
3 out of 3 found this helpful

Comments

0 comments

Please sign in to leave a comment.