Experiment to speed up deeplink connection from WP.com by katinthehatsite · Pull Request #2375 · Automattic/studio

katinthehatsite · 2026-01-09T13:07:52Z

Related issues

Proposed Changes

This PR explores the speeding up of the deeplink connection from WP.com e.g. connecting a WP.com site and opening a modal.

immediately create a minimal site object with data from the deeplink (this would need to be done on WP.com side, but we can add WP.com site's URL and site name which would be enough for our UI)
display the loading skeleton while we are connecting
fetch the remote site right away
and trigger the API refetch in parallel without blocking

Testing Instructions

Pull the changes from this branch
Start Studio
Navigate to the Sync tab
Make sure that you don't have any WP.com sites connected to your Studio site so that the Publish site button displays in the top right corner
Click on the Publish site button
Observe that you are brought to WP.com
Complete the purchase
Wait for the site to go Atomic
Observe that you see a popup asking you to open Studio
Confirm that you can see the loading skeleton on the Sync tab
Confirm that the site you just created is connected in the Sync tab
Confirm that the Push modal is open
Confirm that there are no other regressions

Pre-merge Checklist

Have you checked for TypeScript, React or other console errors?

wpmobilebot · 2026-01-09T13:24:05Z

📊 Performance Test Results

Comparing 4f649f5 vs trunk

site-editor

Metric	trunk	`4f649f5`	Diff	Change
load	1767.00 ms	1486.00 ms	-281.00 ms	🟢 -15.9%

site-startup

Metric	trunk	`4f649f5`	Diff	Change
siteCreation	6079.00 ms	6143.00 ms	+64.00 ms	🔴 1.1%
siteStartup	3944.00 ms	3939.00 ms	-5.00 ms	⚪ 0.0%

Results are median values from multiple test runs.

Legend: 🟢 Improvement (faster) | 🔴 Regression (slower) | ⚪ No change (<50ms diff)

katinthehatsite · 2026-01-09T13:37:00Z

The code needs to be polished quite a bit so I am leaving this PR as a draft. What I am looking for is the feedback on the approach before adding any further polishing touches - does it make sense? is there a different way we could optimize the speed of connection that could be simpler?

One thing I dislike is creating a "fictional" site object that could potentially cause racing conditions and similar issues. Any opinions are welcome!

One option as an alternative that comes to mind could be adding a loading state to Sync tab if the user is connecting a site from deeplink and it is taking time. This way, they could have a visual indication of what is happening and this could be a simple and fast improvement in terms of the UX.

sejas

Thanks for exploring how to speed up the deeplink connection.
In general the approach makes sense to me. Loading an optimistic connection until we fetch more information.
My concern is if we display wrong data, like isStaging, or isPressable. With the current flow where the user purchase a new site, those will always be false, but in the future we could add more deeplinks in Calypso.
What if we show a loading skeleton until we fetch the information?
As mentioned below, we can optimize the fetch call to get only the information for that specific site.

sejas · 2026-02-06T00:13:50Z

src/hooks/sync-sites/use-listen-deep-link-connection.ts

+			}
+
+			// Fetch full site data in background (don't await - parallel operation)
+			const refetchPromise = refetchWpComSites();


Another optimization could be fetching only the information of the remoteSiteId. Currently fetching all the sites takes longer, specially for Automatticians.

I found an endpoint that allowed to fetch just one site instead of all sites so I went with that solution.

sejas · 2026-02-06T00:27:41Z

src/hooks/sync-sites/use-listen-deep-link-connection.ts

+			const minimalSite: SyncSite = {
+				id: remoteSiteId,
+				localSiteId: studioSiteId,
+				name: siteName || 'Loading site...', // Use provided name or placeholder


We need to translate the placeholder.

I think it was not needed at the end after I added the loading placeholder so I removed it.

katinthehatsite · 2026-02-19T10:56:54Z

Thank you for review @sejas - I will take a look at the next steps today 👀

…p-connection-time

katinthehatsite · 2026-02-20T12:48:09Z

@sejas I made some adjustments on this branch based on your recommendations. Would you be able to give it another look?

sejas

@katinthehatsite , great work. Thanks for addressing my suggestions.
I tested it and it works much better with the loading skeleton. Thanks for improving this flow.
I left a couple of comments. Let me know what you think. I also noticed that the loading skeleton is visible even after the single site request resolves, so it seems in the end it uses the whole sites request to decide if should be loading or not. Or at least that was my impression.
I also noticed we try to use the siteurl and site title, but that information is not passed from the deep link. I think it's ok to remove those because the skeleton gives enough context IMO.

Firs time connection:

first-time-connection.mp4

Second time connection:

I also tested it by disconnecting and repeating the deep link.

second-time.mp4

apps/studio/src/hooks/sync-sites/use-listen-deep-link-connection.ts

apps/studio/src/stores/sync/wpcom-sites.ts

apps/studio/src/modules/sync/components/sync-sites-modal-selector.tsx

apps/studio/src/ipc-utils.ts

…p-connection-time

katinthehatsite · 2026-02-24T13:35:02Z

I also noticed that the loading skeleton is visible even after the single site request resolves, so it seems in the end it uses the whole sites request to decide if should be loading or not. Or at least that was my impression.

I saw this as well before but thought it was resolved. Taking a look now 👀

Update: I see it on the reconnection but not on the initial connection 🤔

katinthehatsite · 2026-02-24T18:28:44Z

I made some more adjustments - let me know what you think!

sejas

@katinthehatsite , thanks for applying the suggestions.
I found a bug where Studio opens the list of sites to connect if the user has selected another site.
Steps to reproduce:

Click publish site for site1, and continue the flow
Got to studio and switch to site 2
Go to the browser and click open in studio which should open the modal for site1
Observe that the site correctly connects in the sync tab and the modal that opens shows the list of sites
I would expect the modal that opens is the selective sync

It works as expected if I don't switch sites before clicking open in studio.

publish-site-fast-deep-link-bug-different-local-site.mp4

Resolved conflicts in sync-connected-sites.tsx and sync/index.tsx by adopting trunk's Redux selector pattern (syncOperationsSelectors/Thunks/Actions replacing the old useSyncSites hook) while preserving the PR's isLoadingConnectedSites and isSiteLoading skeleton UI improvements. Made-with: Cursor

katinthehatsite · 2026-03-06T14:24:54Z

Click publish site for site1, and continue the flow
Got to studio and switch to site 2
Go to the browser and click open in studio which should open the modal for site1
Observe that the site correctly connects in the sync tab and the modal that opens shows the list of sites
I would expect the modal that opens is the selective sync
It works as expected if I don't switch sites before clicking open in studio.

Thank you for testing @sejas - I made some further adjustments as well as rebased trunk. Would you be able to give it another test?

Proof of concept

11f9f3b

katinthehatsite self-assigned this Jan 9, 2026

katinthehatsite marked this pull request as draft January 9, 2026 13:07

katinthehatsite requested a review from a team February 4, 2026 13:03

sejas reviewed Feb 6, 2026

View reviewed changes

Kateryna Kodonenko added 8 commits February 19, 2026 14:36

Merge branch 'trunk' of github.com:Automattic/studio into add/speed-u…

8979462

…p-connection-time

Fetch for one site

ea3de7d

Clean up placeholder

eb9646b

Cleanup

ce75d91

Cleanup

d5d2a03

Fix implementation

e04f7f0

Merge branch 'trunk' of github.com:Automattic/studio into add/speed-u…

9e69c10

…p-connection-time

Cleanup and remove unused query

d0c08a6

katinthehatsite marked this pull request as ready for review February 20, 2026 12:48

katinthehatsite requested a review from sejas February 20, 2026 12:48

sejas reviewed Feb 20, 2026

View reviewed changes

Kateryna Kodonenko added 4 commits February 24, 2026 13:48

Merge branch 'trunk' of github.com:Automattic/studio into add/speed-u…

033d6de

…p-connection-time

Remove siteName and siteUrl

c27b6e1

Reuse and extract fields

3b1f58d

Move unsubscribe call

7bce366

Kateryna Kodonenko added 2 commits February 24, 2026 14:41

Create Tailwind utility class for skeleton animation

93a0ee7

Update refetch logic

f221476

katinthehatsite requested a review from sejas February 24, 2026 18:28

sejas reviewed Mar 5, 2026

View reviewed changes

Kateryna Kodonenko added 3 commits March 6, 2026 14:07

Fix issue with the site switching

99b7309

Use set

9af8b34

katinthehatsite requested a review from sejas March 6, 2026 14:24

Fix linter

4f649f5

epeicher mentioned this pull request Mar 6, 2026

Refactor deep link connection handling and connectSite mutation #2665

Open

1 task

Conversation

katinthehatsite commented Jan 9, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Related issues

Proposed Changes

Testing Instructions

Pre-merge Checklist

Uh oh!

wpmobilebot commented Jan 9, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

📊 Performance Test Results

site-editor

site-startup

Uh oh!

katinthehatsite commented Jan 9, 2026

Uh oh!

sejas left a comment

Choose a reason for hiding this comment

Uh oh!

sejas Feb 6, 2026

Choose a reason for hiding this comment

Uh oh!

katinthehatsite Feb 20, 2026

Choose a reason for hiding this comment

Uh oh!

sejas Feb 6, 2026

Choose a reason for hiding this comment

Uh oh!

katinthehatsite Feb 20, 2026

Choose a reason for hiding this comment

Uh oh!

katinthehatsite commented Feb 19, 2026

Uh oh!

katinthehatsite commented Feb 20, 2026

Uh oh!

sejas left a comment • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

katinthehatsite commented Feb 24, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

katinthehatsite commented Feb 24, 2026

Uh oh!

sejas left a comment

Choose a reason for hiding this comment

Uh oh!

katinthehatsite commented Mar 6, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

katinthehatsite commented Jan 9, 2026 •

edited

Loading

wpmobilebot commented Jan 9, 2026 •

edited

Loading

sejas left a comment •

edited

Loading

katinthehatsite commented Feb 24, 2026 •

edited

Loading