Navigation: Preload API requests

[noisysocks]

When loading the Navigation screen, there are a lot of loading spinners due to API requests to /menus and /menu-items. We should preload these requests so that the screen appears faster.

For reference, here's how edit-site does this:

https://github.com/WordPress/gutenberg/blob/f62d5ea0a308f58767dbcff051d1ff02af668f11/lib/edit-site-page.php#L153-L172

[noisysocks]

Doesn't look like we can use wp.apiFetch.createPreloadingMiddleware. See https://github.com/WordPress/gutenberg/pull/24672#issuecomment-680375627.

[spacedmonkey]

Some preloading was added in https://github.com/WordPress/gutenberg/pull/34364

However, there are still a number of API requests that are not preloaded.

The one I could not work out in my testing was '/wp/v2/types/?context=edit',. I believe that types endpoint is hit early in the load process and did not hit the preloading middleware. I couldn't work it while working on https://github.com/WordPress/gutenberg/pull/34364 .

I still think we should revisit this ticket and try preload a much as data possible. It worth nothing, you are avoid preloaded data, by just adding a query string to REST API request. Like this.

wp.apiFetch({path: "__experimental/menus?cb=<timestamp>"})

[talldan]

I think the types one loads as a side effect of the 'stub' navigation post entity that @adamziel implemented - because it's a postType entity it causes them to be fetched.

It should go away if https://github.com/WordPress/gutenberg/pull/34839 makes it in.

edit: worth noting that postTypes are still fetched when the block placeholder is displayed for the 'Add all pages' option, so it could still be worth caching.

[anton-vlasenko]

Are there any additional steps needed to reproduce this? When I tried to reproduce this in my local environment, I only saw one xhr/fetch request. What do I need to do to see those "additional" requests? I'd appreciate it if somebody could help me to reproduce this issue.

[spacedmonkey]

@anton-vlasenko are you sure you haven't got a filter on? Looks like there is something in the search field...

Here is a screencast of my screen.

https://user-images.githubusercontent.com/237508/134253125-72998df7-ab46-4bfa-9316-e18e0746e9ce.mov

The following requests should be preloaded

• wp/v2/types/
• __experimental/menus?context=edit&per_page=100

We should also remove call to __experimental/menus/<current_menu_id> as this data will be loaded in __experimental/menus

[anton-vlasenko]

@spacedmonkey Thank you for the screencast! I'm able to reproduce it now. I don't know what was going on, I believe I didn't have any filters. But it doesn't matter because I'm able to reproduce it now. Thank you!