Making a Page That Runs reCAPTCHA Load Fast
By Rehan Sayyed, SRT Corporates · Published
The Home page of Click With The World looks simple: a number and a button. Behind it, the page opens a live connection to a database and runs Google's bot check before a single click can count. Both are heavy. This is an account of making the page feel quick anyway, including the change that made it slower.
All figures are from Google's PageSpeed Insights tests of our own Home page.
Where we started
On 4 October 2026 the mobile score was 71 out of 100. The bigger problem was layout shift, the measure of how much a page jumps around while loading. Google counts a score of 0.1 or less as good and anything above 0.25 as poor. Ours was 0.365 on mobile and 0.809 on desktop.
In plain terms, the page appeared and then lurched.
Problem one: the page jumped
The test traces pointed to the order in which things loaded. A third-party script sat at the very top of the page, ahead of the stylesheets, and the page was being measured before its styles had arrived. When they landed, everything moved.
We made three changes together:
- The script was moved so that it comes after the stylesheets.
- The web fonts stopped holding up the first draw. They now load in the background and swap in when ready.
- The lists that fill in later, Top Countries and Live Clicks, were given reserved space, so their arrival pushes nothing down.
Because these went in together, we can't say how much each one contributed. Layout shift came down to between 0 and 0.01.
Problem two: we made it slower
The same round of changes dropped the mobile score from 71 to 57. First Contentful Paint, the moment the first text or image appears, went out to 7.0 seconds.
The cause was a side effect. With less standing in their way, the page's own scripts started sooner. That meant the bot check began its work before the browser had drawn anything, and the first draw had to wait behind it.
The fix was to turn the order round. The page now waits until the browser reports that it has painted, and only then starts the counter's code and the check. Two safety nets cover the odd cases: a three-second timer in case no paint is ever reported, and an immediate start when the tab is opened in the background.
First Contentful Paint came back to 2.6 seconds, and the mobile score to 73 and 77 on two runs.
The lesson was an old one. Removing a delay in one place can move the work somewhere worse, so every change needs measuring on its own.
Smaller changes
- The large background image is fetched early, in a smaller version for phones.
- The browser is told in advance which outside hosts it will need, so those connections open sooner.
- Flag images are stored by the browser for a year and other images for 30 days.
- One idea was taken back out. Fetching the database library early made the measured first paint worse.
Where it stands
A test on 7 October 2026, mobile:
| Measure | Result |
|---|---|
| Performance score | 82 |
| Layout shift | 0.007 |
| First Contentful Paint | 2.6 s |
| Largest Contentful Paint | 3.7 s |
| Total Blocking Time | 210 ms |
Two things are not finished. Largest Contentful Paint was 2.6 seconds on 4 October and 3.7 seconds here, and we have not yet found out why. And the bot check still takes a noticeable share of the phone's processing time. We can't remove it, because it is what keeps the count fair.
Scores also move a few points from one run to the next, so single results should be read loosely.
What a visitor sees now
The page draws straight away with a dash where the number will be. A moment later the live total, the countries and the recent clicks fill in, and nothing on the page moves to make room for them.