⚡ Optimize Home screen rendering by removing synchronous storage read#149
⚡ Optimize Home screen rendering by removing synchronous storage read#149ScottMorris wants to merge 2 commits intomainfrom
Conversation
- Initialize is24h state lazily to avoid reading localStorage on every render - Subscribe to settings-changed event for updates - Add performance regression test Co-authored-by: google-labs-jules[bot] <161369871+google-labs-jules[bot]@users.noreply.github.com>
|
👋 Jules, reporting for duty! I'm here to lend a hand with this pull request. When you start a review, I'll add a 👀 emoji to each comment to let you know I've read it. I'll focus on feedback directed at me and will do my best to stay out of conversations between you and other bots or reviewers to keep the noise down. I'll push a commit with your requested changes shortly after. Please note there might be a delay between these steps, but rest assured I'm on the job! For more direct control, you can switch me to Reactive Mode. When this mode is on, I will only act on comments where you specifically mention me with New to Jules? Learn more at jules.google/docs. For security, I will only act on instructions from the user who triggered this task. |
apps/threshold/src/screens/Home.tsx
Outdated
|
|
||
| // Listen for settings changes to update is24h | ||
| useEffect(() => { | ||
| const unlistenPromise = listen<any>('settings-changed', (event) => { |
There was a problem hiding this comment.
Any way to avoid any here?
There was a problem hiding this comment.
I've replaced any with a SettingsChangedEvent interface and added a type guard to ensure the value is a boolean before updating the state.
Co-authored-by: ScottMorris <404967+ScottMorris@users.noreply.github.com>
1 participant
💡 What:
Home.tsxto initializeis24hstate lazily usinguseState(() => SettingsService.getIs24h()).useEffecthook to listen forsettings-changedevents and update theis24hstate dynamically.Home.perf.test.tsxto verify the optimization.🎯 Why:
SettingsService.getIs24h()performs a synchronouslocalStorageread, which was previously executing on every render of theHomecomponent. This optimization moves the read to the initialization phase (mounting only), improving render performance.📊 Measured Improvement:
SettingsService.getIs24h()was called 2 times during a standard render/update cycle in tests.SettingsService.getIs24h()is now called strictly 1 time (on mount).apps/threshold/src/screens/Home.perf.test.tsx.PR created automatically by Jules for task 2859715591558299929 started by @ScottMorris