v6 navbar is laggy (low framerate)

Open
  • Is something wrong?
#43,284 1 comment 0 reactions 0 assignees View on GitHub

Maintainers usually reply within 1 day

Nobody has claimed this yet.

Assessment

Difficulty
3/5
Estimated time
1-2 days
Newbie friendliness
58/100
Issue type
Bug
Clarity
Mostly clear
Activity status
Active
Tech stack
bootstrap, css, javascript
Domain
frontend, performance

Research direction

Start with the navbar spillover behavior shown on the Bootstrap 5.3 migration page and reproduce the low frame rate in Firefox on macOS. Inspect the navbar styles and scripts involved in spillover, then profile the lag to identify its source. Done means the navbar remains responsive during spillover without the reported stutter.

Written by the indexing model from the issue text.

Description

bug confirmed css docs needs-decision performance v6
Prerequisites
Describe the issue

Using the new BS6 nav bar with spillover creates a notably low frame rate. This could also be described as laggy or glitchy or slow or stuck.

https://github.com/user-attachments/assets/1101d93b-e8e2-452b-8155-1b98d5da7f9b

Reduced test cases

https://getbootstrap.com/docs/5.3/migration/#navbar

Just load the documentation page in your browser

What operating system(s) are you seeing the problem on?

macOS

What browser(s) are you seeing the problem on?

Firefox

What version of Bootstrap are you using?

6.0.0.alpha.1

Dominant language
MDX
Stars
175k
Forks
78.7k
Avg merge
1d 7h
Merged PRs (30d)
103

Getting set up

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

More from twbs/bootstrap

All issues in twbs/bootstrap

Similar issues

More Web Dev issues

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.