Automattic / Automattic/jetpack

Search: improve performance of the javascript bundle

Open
#16,224 3 comments 0 reactions 0 assignees View on GitHub
[Feature] Search [Focus] Performance Enhancement
Dominant language
PHP
Stars
1.8k
Forks
898
Avg merge
1d 18h
Merged PRs (30d)
774

Description

The js bundle for instant search is 33kb (and probably growing). We've done a lot to keep it small, but it rivals jQuery now. Can we lazy load it, and also make sure that it always loads from our CDN to make it more likely that it will be cached?

Some corner cases where this may break:
- User goes to a url for search results, then we should not lazy load it since the correct results won't be displayed until the js has loaded. There may be other cases like this in the future too.
- Do we need to break out any js so that it can be applied to the elements on the page? Thinking about the search box in the widget and any filter links on the page.

We should probably be optimizing for https://developers.google.com/speed/pagespeed/insights/

Contributor guide

Open the contributing guide

Research direction

Start by locating the instant search JavaScript bundle and the code that loads it. Trace search-result URLs, the search widget, and filter links to identify what can be lazy-loaded or served from the CDN; done means those cases still work and the bundle's loading improves the PageSpeed result.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
frontend, performance, web-dev
Issue type
Feature
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.