Performance Issue with Autofill Functionality in Vite + Vue 3 Application

[manuelgoi]

Steps To Reproduce

1. Start the application with Bitwarden extension enabled.
2. Perform drag-and-drop operations on elements within any scrollable area.
3. Observe the performance impact and frequent calls to requestIdleCallbackPolyfill() in Chrome's performance profile.

Expected Result

The autofill functionality should not significantly impact application performance and should handle idle callbacks more efficiently.

Actual Result

The autofill process significantly affects the application's responsiveness and performance, especially during drag-and-drop interactions within scrollable areas.

Screenshots or Videos

Additional Context

I am experiencing a significant performance issue in a web application developed using Vite, Vue 3, TypeScript, and Pinia. The issue becomes evident when performing drag-and-drop operations on elements within a layer that has overflow scrolling enabled. The problem is associated with the bootstrap-legacy-autofill-overlay.js file, specifically the requestIdleCallbackPolyfill() function.

Issue Details:

Environment: Vite + Vue 3 + TypeScript + Pinia
The performance profiling tools in Chrome DevTools indicate that the requestIdleCallbackPolyfill() function is frequently triggered and consumes a significant amount of CPU time. This function is called as part of the autofill process initiated by Bitwarden, and it severely impacts the application's performance, particularly during user interactions involving scrolling and element manipulation.

The profiling data shows repeated activations of the polyfill function, particularly when inactive scroll activation tasks are triggered. It appears that the autofill functionality is interacting in a way that significantly degrades performance during these operations.

Operating System

macOS, Linux

Operating System Version

Macos 15.1

Web Browser

Chrome

Browser Version

130.0.6723.117

Build Version

(Build oficial) (arm64)

Issue Tracking Info

• I understand that work is tracked outside of Github. A PR will be linked to this issue should one be opened to address it, but Bitwarden doesn't use fields like "assigned", "milestone", or "project" to track progress.

[bitwarden-bot]

Thank you for reporting this issue! We've added this to our internal tracking system.
ID: PM-14992

[ejallier]

Hello, same problem for me.
My website is really slower when the extension is activated.
I have the error related to bootstrap-legacy-autofill-overlay.js

[cagonzalezcs]

@jprusik

The performance issues described here are related to similar other reports in the past, for instance: #11077

Some recent improvements in the extension have helped with this kind of concern, but improving the performance cost of autofill is tricky. The main issue at hand is going to be the MutationObsevers that need to identify when changes occur in the DOM to re-capture form field data...