Integrate with Cloudflare's new Automatic Platform Optimization

[gevcen]

Is your feature request related to a problem? Please describe.
Cloudflare has released a new feature called Automatic Platform Optimization. However, a problem arises is that it requires the official Cloudflare plugin to be installed, which therefore requires to disable WP Rocket's Cloudflare addon.

This leads to a problem, that users will never be sure that Cloudflare's cache would be cleared when the cache is cleared in WP Rocket. Eventough their official plugin supports clearing cache on content update, it doesnt answer the problem that Cloudflare cache won't be cleared when it's manually cleared by the user in WP Rocket.

Describe the solution you'd like
WP Rocket has all the necessary information in the Cloudflare addon (APIs...) that is sufficient for enabling the new Automatic Platform Optimization and those data can be sent to Cloudflare when we enable the feature.

Describe alternatives you've considered
Alternatively, we could add a toggle within the Cloudflare addon in WP Rocket to enable the new APO, and in this case it's WP Rocket who will make the "call" by sending the APIs. Similar button already exist for Dev Mode.

In fact, this alternative is the only possible way to integrate this feature into WP Rocket. Why? Well the other way around is hardly achievable because if we enable APO from Cloudflare dashboard itself, then I wonder how Cloudflare will find the APIs of WP Rocket's Cloudflare addon.

So the integration must come from the Cloudflare addon within WP Rocket, which I think many of us will appreciate being taken as a new priority.

Additional context
This is a major enhancement.

[PatrickD1985]

For now it will only work without having the WP Rocket Cloudflare add-on enabled as it conflicts with the Cloudlfare plugin BUT ALSO you now need the Cloudflare official plugin.

And indeed invalidating cache is a thing here.

For APO in an ideal situation I would love to see this be supported from within the add-on of WP-Rocket as this means one less plugin is needed and it will help to keep control over how Cache/Cloudflare is handled.

[Basilakis]

@PatrickD1985 is APO works for WooCommerce?

[PatrickD1985]

@Basilakis I would not be able to confirm that. As I have personal webshops.
Perhaps others can confirm this.

Please note; As it stands there is an issue currently with APO;
https://community.cloudflare.com/t/automatic-platform-optimization-enabled-i-no-longer-see-visitor-ip/210241/29
Estimated fix is coming Wednesday.

[Basilakis]

Thank you for Sharing

[ScottTravisHartley]

I can confirm that APO does work with woocommerce because it does make exclusions for woocommerce related cookies and was included in the announcement post.

[PatrickD1985]

And I can confirm Cloudflare released a fix for https://community.cloudflare.com/t/automatic-platform-optimization-enabled-i-no-longer-see-visitor-ip/210241/45
Which has been tested by myself and multiple others not to break real ip checks anymore (security and other limitations kinda stuff).

So if the WP-Rocket team can look into an integration, that would be marvelous.

[CyberCr33p]

Lots of my clients need this.

[markllego]

Quick Question: May I know if I can use the Cloudflare APO with WP-Rocket (having the Cloudflare option disabled)? Thank you.

[PatrickD1985]

@markllego APO does work with the cloudflare integration off in WP-Rocket and using the official Cloudflare Wordpress plugin. (Currently that is the only way to use it with WP Rocket)

I am still in the process of seeing how much benefit this really gives. (Still not sure if it will yield any major advantage over our own setup, but I have not been able to test that yet due to the above mentioned issue). I will get back on that here in the upcoming week. From what I have seen so far it really seems to help with FCP, TTFB and the like.

But in the long run having WP Rocket support APO would be great whichever way you look at it.

For quick reference, after setting it up you should be able to see the below header on your requests;
x-via: speedwp/origin,cookie
That way you know it is being served through APO.

[markllego]

I can confirm that WP-Rocket is working fine with Cloudflare APO.

Header:

status: 200
x-cache: HIT
set-cookie: __cfduid=d47b0b49c7bf0f606541c64303647b1531602349346; expires=Mon, 09-Nov-20 17:02:26 GMT; path=/; domain=.teacherph.com; HttpOnly; SameSite=Lax; Secure
cf-cache-status: HIT
expires: Sat, 10 Oct 2020 14:53:22 GMT
vary: Accept-Encoding
x-via: speedwp/cache
last-modified: Sat, 10 Oct 2020 14:53:22 GMT
link: https://www.teacherph.com/wp-json/; rel="https://api.w.org/"
report-to: {"endpoints":[{"url":"https://a.nel.cloudflare.com/report?lkg-colo=22&lkg-time=1602349346"}],"group":"cf-nel","max_age":604800}
date: Sat, 10 Oct 2020 17:02:26 GMT
cf-ray: 5e01e8b6eeb40abc-NRT
cf-edge-cache: cache,platform=wordpress
expect-ct: max-age=604800, report-uri="https://report-uri.cloudflare.com/cdn-cgi/beacon/expect-ct"
nel: {"report_to":"cf-nel","max_age":604800}
x-xss-protection: 1; mode=block
x-content-type-options: nosniff
content-encoding: br
age: 6532
strict-transport-security: max-age=31536000; includeSubDomains; preload
cf-request-id: 05b50fc65100000abc9ca4f200000001
server: cloudflare
cache-control: max-age=0
x-frame-options: SAMEORIGIN
content-type: text/html; charset=UTF-8
:status: 200

[webtrainingwheels]

Another request/inquiry: https://secure.helpscout.net/conversation/1309075581/202360?folderId=273766

[patche81]

Any update regarding this ? this is a major feature IMHO

[vmanthos]

Related ticket: https://secure.helpscout.net/conversation/1325982650/207868/

[patche81]

Folks we need this in CORE asap

[webtrainingwheels]

Related: https://secure.helpscout.net/conversation/1342363416/213604?folderId=4130683

[webtrainingwheels]

https://secure.helpscout.net/conversation/1337164234/211666?folderId=4130683

[tonydehnke]

How can we access/see what is in those urls @webtrainingwheels - as they require a login?

[webtrainingwheels]

@tonydehnke They are for our team's internal use only :)

[sejoker]

Hey, I'm an engineer working on Automatic Platform Optimization, let me know if you need any help with the integration. I know we haven't published docs on api.cloudflare.com for the feature. We are planning to finalize last parameters and publish it in the coming 2 weeks.

[viobru]

Related: https://secure.helpscout.net/conversation/1342665684/213710/

[sunnyt7]

I would like to see this as well. Running into a lot of issues using the two together - particularly with Nginx server-side and APO caching getting mixed up.

For example, if I use WP Rocket to minify CSS, the HTML often links to an outdated minified file (see: https://community.cloudflare.com/t/cloudflares-apo-with-wp-rockets-minified-css/225906)

Or changes to content won't be visible for quite some time, and requires a manual purge of all caches. Ideally, WP Rocket could purge them all at once like it can when not using APO.

[scorpionmit01]

Can we just turn off the WP-Rocket Cloudflare integration? Faster for no downside is a good one, but there appears to be an issue with CSS.

[vergosteak]

Hope we will see an integration soon ! It would be a major enhancement. I really want to use APO with WP rocket

[crystinutzaa]

@sejoker I am the developer of WP Rocket and I would love to get in touch and discuss about the integration with Automatic Platform Optimization. Do you have any initial documentation about it where I can see how should be integrated with WP Rocket?

You can reach me by email at: cristina@wp-media.me and keep in touch on email 😄

[scorpionmit01]

Hi, thanks for reaching out! I am not an expert on Automatic Platform Optimization, but Cloudflare is pushing it pretty hard. Happy to help and give you my thoughts. Requirements Document: 1. Website should have the Cloudflare Plugin v3.8.7 or higher 2. WP Rocket will need to let Cloudflare's plugin manage it 3. PHASE 2 (not MVP) - WP Rocket should have a "use Cloudflare Automatic Platform Optimization" button that sets up the Cloudflare Plugin for WP Rocket Sites Here is where I see their Documentation: https://support.cloudflare.com/hc/en-us/articles/360049822312-Understanding-Automatic-Platform-Optimization-APO-with-WordPress The main thing I see is that Cloudflare will manage the Cloudflare plugins based upon native hooks. WP Rocket would need to hop in prior to Cloudflare and purge WP Rocket's cache https://support.cloudflare.com/hc/en-us/articles/115002708027-Cloudflare-WordPress-Plugin-Automatic-Cache-Management- I think that the main thing will be to effectively be running with Cache Everything, at least as much as possible. You'd need to test, but I think if you can hook into their cache clearing events first, we should be golden. Alex

…

On Mon, Dec 14, 2020 at 5:42 AM Cristina Soponar ***@***.***> wrote: @sejoker <https://github.com/sejoker> I am the developer of WP Rocket and I would love to get in touch and discuss about the integration with Automatic Platform Optimization. Do you have any initial documentation about it where I can see how should be integrated with WP Rocket? You can reach me by email at: ***@***.*** and keep in touch on email 😄 — You are receiving this because you commented. Reply to this email directly, view it on GitHub <#3180 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/ABYN4VJOS6X4SL7A4UD33ALSUXTX7ANCNFSM4SCREAKQ> .

-- Book a meeting with me <https://www.cloudhq.net/meeting/alexhochberger@gmail.com>

[crystinutzaa]

@scorpionmit01
Edit the website means that a post / page content was updated.
This means that WP Rocket cache is expired. If Cloudflare APO is enabled, when WP Rocket cache is cleaned, it will trigger also the cleaning of Cloudflare cache (to be in-sync), so there will not be any errors related to out-of-sync cache.

I would love to give you an ETA for this change, however I don't have a fixed deadline for it.

This task is groomed now and is waiting to be planned for a future sprint, however I cannot guarantee that it will be released before 1 March

[GeekPress]

@crystinutzaa Thanks for the extra info. It seems an option will be the best approach based on your last feedback.

Label
Automatic Platform Optimization (APO)

Description
Serve your entire site from Cloudflare edge network. More info.

@vmanthos @webtrainingwheels I ping you on to have your feedback. Does the wording sound good to you?

[patche81]

any ETA regarding this ?

[scorpionmit01]

Okay, there should be a release 3.8.6 tomorrow (March 1). It was indicated that the fix for the 404 on CSS and JS should be in this? At that point, how compatible should it be? Is the risk: Cloudflare might serve outdated content if you don't flush the cache? or Cloudflare might get 404s on updated content. The former is a more manageable risk (update important content, flush the cache, fix a typo, don't worry about it). Just trying to understand where this appears to be with the 3.8.6 release. I can take responsibility for having outdated content on my site if I dont flush the cache. It's far more of a concern to have unpredictable 404s.

…

On Tue, Feb 23, 2021 at 9:03 AM patche81 ***@***.***> wrote: any ETA regarding this ? — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#3180 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/ABYN4VPHVFV7AFDL6ZQO4ILTAOYRVANCNFSM4SCREAKQ> .

-- Book a meeting with me <https://www.cloudhq.net/meeting/alexhochberger@gmail.com>

[GeekPress]

any ETA regarding this ?

@patche81 We don't have any ETA to provide you yet until a milestone will be set on this issue.

@scorpionmit01 The risk will be > Cloudflare might serve outdated content if you don't flush the cache?

[ScottTravisHartley]

That is part of the issue the bigger issue is when WProcket's cache is cleared automatically and Cloudflare's is not. This can then cause a 404 error on minified CSS/JS files which can cause the layout to become out of sync.

[webtrainingwheels]

https://secure.helpscout.net/conversation/1443313354/244405?folderId=377611

[SimJoSt]

It would be great to have this big feature mentioned on the new roadmap for non-technical users as well: https://feedback.wp-rocket.me/roadmap

[dreamjobma]

I think they want to keep this for WP Rocket 4.0

[GeekPress]

@SimJoSt It hasn't been added to our new roadmap as we already know it's something we have to work on ;)

[SimJoSt]

@GeekPress that's true :)
But not every customer and interested party will read through the GitHub issues, so making it transparent to them, especially with an issue this big, would be very forthcoming 🙏

[GeekPress]

@SimJoSt You're right. Here we go: https://feedback.wp-rocket.me/16

[kumzee]

Hi guys,

One of my client had broken page layout over the Easter break (4 days) losing half their conversions.
Any idea when is this update being rolled out?

[GeekPress]

@kumzee Hi 🤚 As mentioned in the milestone section, it's scheduled for 3.10. No ETA yet about the release date.

[roadsunknown]

3.8 December 9, 2020
3.7 August 27, 2020
3.6 June 9, 2020

On average, minor version releases are every 3 months. This would assume a 3.9 release in March but that did not happen so at the earliest we should be expecting 3.10 at least 3-4 months from now or over 9 months after this issue was first opened and APO was released.

[DahmaniAdame]

APO supports a separate cache for desktop and mobile devices.
https://support.cloudflare.com/hc/en-us/articles/360049822312#h_01ERZ6QHBGFVPSC44SJAC1YM6Q

And they seem to have a API to control it: cache_by_device_type
https://api.cloudflare.com/#zone-settings-change-automatic-platform-optimization-for-wordpress-setting

Could be a good thing to pair with our Separate Cache for Mobile devices feature.

[vmanthos]

Related request: https://secure.helpscout.net/conversation/1633689319/295337/

[alfonso100]

related request: https://secure.helpscout.net/conversation/1651185335/299305

[DahmaniAdame]

Related - https://secure.helpscout.net/conversation/1953820886/356890/

[remyperona]

Scope a solution ✅

Settings Page

• Add new Automatic Optimization Platform checkbox to the cloudflare settings section
• Add a button to refresh the data from Cloudflare
• Add a method to serve as callback for the data refresh AJAX call
• Update the settings page JS to handle the new AJAX call

Estimate the effort ✅

Effort [M]

Settings update

• When saving the settings after changing the option, make and API call to the APO CF endpoint to enable/disable it
• Use the separate cache for mobile option value to send the Cache By Device Type value
• If the separate cache for mobile option is changed while the APO option is enabled, make an update call to the APO CF endpoint
• Store the API call response in an network option + a network transient to save the call done for one week
• Display an error message if there is an error during the API call

Estimate the effort ✅

Effort [M]

Cloudflare class

• Add a method to the Cloudflare class to check if APO is available for the currently configured account
• Add a method to handle the APO endpoint call, using the PATCH method type

Estimate the effort ✅

Effort [S]

Multisite support

• If multisite is enabled, and APO is enabled on a subsite, synchronize the value of the specific mobile cache per device
• Grey-out the specific cache for mobile option to prevent changing it

Estimate the effort ✅

Effort [S]