Gradients in the address bar should be changed to borders on Mac for speed

RESOLVED FIXED in Firefox 4.0b10

Status

()

defect
RESOLVED FIXED
9 years ago
9 years ago

People

(Reporter: pcwalton, Assigned: pcwalton)

Tracking

({perf})

unspecified
Firefox 4.0b10
x86
macOS
Points:
---

Firefox Tracking Flags

(Not tracked)

Details

(Whiteboard: [frame-rate-monitor])

Attachments

(1 attachment, 1 obsolete attachment)

Assignee

Description

9 years ago
When resizing the window, I see a lot of time spent drawing the gradients in the UI bar. These gradients can be borders instead, which render a lot quicker.

With this patch and the Mac events patch in bug 625454, resizing about:blank is noticeably faster in Firefox than in Chrome for me.
Assignee

Updated

9 years ago
Keywords: perf
Are these so small the gradient isn't visible?

/be
status2.0: --- → ?
Assignee

Comment 2

9 years ago
Posted patch Proposed patch. (obsolete) — Splinter Review
Proposed patch attached.
Attachment #505216 - Flags: review?(gavin.sharp)
Assignee

Comment 3

9 years ago
(In reply to comment #1)
> Are these so small the gradient isn't visible?
> 
> /be

They're one pixel wide and ~20 pixels tall. I can't tell the difference.
Assignee

Updated

9 years ago
Whiteboard: [frame-rate-monitor]
Attachment #505216 - Flags: ui-review?(shorlander)
Attachment #505216 - Flags: review?(gavin.sharp)
Attachment #505216 - Flags: review?(dao)
+  border-top: 1px solid rgba(98, 98, 98, 1.0);
+  border-right: 1px solid rgba(120, 120, 120, 1.0);
+  border-left: 1px solid rgba(120, 120, 120, 1.0);
+  border-bottom: 1px solid rgba(140, 140, 140, 1.0);
+  -moz-border-left-colors: none;
+  -moz-border-right-colors: none;
+  -moz-border-top-colors: none;
+  -moz-border-bottom-colors: none;

I think the border shorthand resets -moz-border-*-colors now, so this could be:

  border: 1px solid;
  border-top-color: rgb(98, 98, 98);
  border-right-color: rgb(120, 120, 120);
  border-left-color: rgb(120, 120, 120);
  border-bottom-color: rgb(140, 140, 140);

For opaque colors the #RRGGBB notation is more common in this file, but that probably doesn't matter.
Comment on attachment 505216 [details] [diff] [review]
Proposed patch.

>+  border-top: 1px solid rgba(98, 98, 98, 1.0);
>+  border-right: 1px solid rgba(120, 120, 120, 1.0);
>+  border-left: 1px solid rgba(120, 120, 120, 1.0);
>+  border-bottom: 1px solid rgba(140, 140, 140, 1.0);
>+  -moz-border-left-colors: none;
>+  -moz-border-right-colors: none;
>+  -moz-border-top-colors: none;
>+  -moz-border-bottom-colors: none;

Replace with:
  border: 1px solid;
  border-color: rgb(98,98,98) rgb(120,120,120) rgb(140,140,140);

Also add background-clip: padding-box; here for the corners to look right in focused state.

> #urlbar:-moz-window-inactive,
> .searchbar-textbox:-moz-window-inactive {
>-  background-image: -moz-linear-gradient(#D6D6D6, #D6D6D6 1px, #F7F7F7 1px, #F7F7F7 2px, #FFF 2px, #FFF),
>-                    -moz-linear-gradient(@toolbarbuttonInactiveBorderColor@, @toolbarbuttonInactiveBorderColor@);
>+  border: 1px solid @toolbarbuttonInactiveBorderColor@;

border-color: @toolbarbuttonInactiveBorderColor@;

> #urlbar[focused="true"],
> .searchbar-textbox[focused="true"] {
>-  background-color: -moz-mac-focusring;
>-  background-image: -moz-linear-gradient(#D6D6D6, #D6D6D6 1px, #F7F7F7 1px, #F7F7F7 2px, #FFF 2px, #FFF),
>-                    -moz-linear-gradient(rgba(0,0,0,.1), rgba(0,0,0,.1));
>+  border: 1px solid -moz-mac-focusring;

border-color: -moz-mac-focusring;

r=me with these changes.
Attachment #505216 - Flags: review?(dao) → review+
Comment on attachment 505216 [details] [diff] [review]
Proposed patch.

This looks good with the changes Dão suggested.
Attachment #505216 - Flags: ui-review?(shorlander) → ui-review+
Assignee

Comment 7

9 years ago
Patch version 2 addresses review comments. Requesting approval2.0 for this small, low-risk CSS change.
Attachment #505216 - Attachment is obsolete: true
Attachment #505483 - Flags: approval2.0?
Attachment #505483 - Flags: approval2.0? → approval2.0+
Assignee

Updated

9 years ago
Keywords: checkin-needed
Pushed http://hg.mozilla.org/mozilla-central/rev/b9e2c6e0f2ad
Status: ASSIGNED → RESOLVED
Closed: 9 years ago
status2.0: ? → ---
Keywords: checkin-needed
Resolution: --- → FIXED
Target Milestone: --- → Firefox 4.0b10
You need to log in before you can comment on or make changes to this bug.