From 70b52e0994cfed9196a84d205ee0de236118014d Mon Sep 17 00:00:00 2001 From: Jelle Raaijmakers Date: Fri, 9 May 2025 14:51:48 +0200 Subject: [PATCH] LibWeb: Use efficient background repeat path for either direction We're able to efficiently draw repeated bitmaps through Skia, but for backgrounds we only did so if the background was `repeat-x` _and_ `repeat-y`, and not if just one was set. This meant that for backgrounds that were only repeating in one direction, we were taking the slow path. Turns out that this slow path also produced graphical artifacts when zooming in and out, so let's not do that :^) --- Libraries/LibWeb/Painting/BackgroundPainting.cpp | 2 +- .../css-background-repeat-x-and-zoomed-ref.html | 7 +++++++ .../css-background-repeat-x-and-zoomed-ref.png | Bin 0 -> 3463 bytes .../css-background-repeat-x-and-zoomed.html | 15 +++++++++++++++ 4 files changed, 23 insertions(+), 1 deletion(-) create mode 100644 Tests/LibWeb/Screenshot/expected/css-background-repeat-x-and-zoomed-ref.html create mode 100644 Tests/LibWeb/Screenshot/images/css-background-repeat-x-and-zoomed-ref.png create mode 100644 Tests/LibWeb/Screenshot/input/css-background-repeat-x-and-zoomed.html diff --git a/Libraries/LibWeb/Painting/BackgroundPainting.cpp b/Libraries/LibWeb/Painting/BackgroundPainting.cpp index 1d676c3c901..4faed6b75e2 100644 --- a/Libraries/LibWeb/Painting/BackgroundPainting.cpp +++ b/Libraries/LibWeb/Painting/BackgroundPainting.cpp @@ -295,7 +295,7 @@ void paint_background(PaintContext& context, PaintableBox const& paintable_box, fill_rect.unite(image_device_rect); }); display_list_recorder.fill_rect(fill_rect.to_type(), color.value()); - } else if (is(image) && repeat_x && repeat_y && !repeat_x_has_gap && !repeat_y_has_gap) { + } else if (is(image) && (repeat_x || repeat_y) && !repeat_x_has_gap && !repeat_y_has_gap) { // Use a dedicated painting command for repeated images instead of recording a separate command for each instance // of a repeated background, so the painter has the opportunity to optimize the painting of repeated images. auto dest_rect = context.rounded_device_rect(image_rect); diff --git a/Tests/LibWeb/Screenshot/expected/css-background-repeat-x-and-zoomed-ref.html b/Tests/LibWeb/Screenshot/expected/css-background-repeat-x-and-zoomed-ref.html new file mode 100644 index 00000000000..fdb1100a93d --- /dev/null +++ b/Tests/LibWeb/Screenshot/expected/css-background-repeat-x-and-zoomed-ref.html @@ -0,0 +1,7 @@ + + + diff --git a/Tests/LibWeb/Screenshot/images/css-background-repeat-x-and-zoomed-ref.png b/Tests/LibWeb/Screenshot/images/css-background-repeat-x-and-zoomed-ref.png new file mode 100644 index 0000000000000000000000000000000000000000..fa053f30e7f201fe876545b160ce3034059377cd GIT binary patch literal 3463 zcmeAS@N?(olHy`uVBq!ia0y~yU{+vYV2a>iVqjnp6%kcuVBq!hba4!+xb^nVUGFPD z;z%>ymb_+|7J3)+KS# z#d{&bE}fnW6_ga0v@ZD3aPG#O_qT*{e-~`t{NT-=IF46m-kaC#-`_8upLR^sWBFx4 z1_q<$2UHmt1R@w1n7A1n5*Qg2HZU--h%q!AU;=YFbQl`y>k|Iz>;L}tW$*cA>?aeYHp`8iK7!I7`UlS1CTsbkrM5uf1om!R26GOC&(ibo|gt3GPyvn+~ z?8LrW?Q;1}mnHk{g(8gt85F#kw8eh!Tvzv}@aen7n~gs`>pj54ut|LbE~f}Y=rMxb z1a&DxBP-0M43RPspFe+gc6QFbwr1tJb$WVwX6g(M34iyc7+IQ`nORs!^t!!%{rdX) z`2AI1U)gi5aZ&pC>+9>y>F2j?+t&8Dmy1Cl;=b3?pud0r+S=NlpKq_Pp^=f9X<7K_ z$g{Jvxw*OPs|)Jt>N3{1^UH^Yhqv?H-jLWF$jHF-I(*u+Y4`TkR)2nW_JYsJlub*P zEZM%jJS*$fnVH7EzP|f&*KFFfN!h*c&aTqct5>gHxNzaBRa#=*GsPGbHq?E5d3ia% zyj{%xy1)Pa{uUJ#b?=wU&B@tQ^)>6o@(h!zhlg5!{rdIi&!6@FocpIupZ@;t?(g5; z-ma~!{r&Cj>NRUjbU~gB3Ktd@o;!DLzntx@oyE_07C(2=ZLRA%{`mU3*xkj?&z(7Q z=4iLLdET8LXFE4Wy!r6(aKF60oP3JCLj0VW;n6%fRwcK>{+w4G&EMMSP`*3 z@9y;5!7HzP`0!z>c6e2F_4oJp>;L`v8N0h|ZR~EdxqjQXZxsbS1q&B0T(acJ>)lQU zvQ{N4Hf{R!^z`)k_n*)6TfX1YmL<$0yQan_B+A>n8)As5sj1@HQ>Rbwud6lqk#}?c zoF6~uzBwo_E3imc<<^rYPaZs2aDa)SNMnQFT&t`1?#Xo@UA20(@$P*YCbQLNc z{_(N}=<#r%#`z{!zaE`t@sVZEbfqw;nEr6KfA>MSLq?lV4U=mY8^O4nxBn z?lt?*KY8-x%$XibMg}JB$&IGg*3ls$A%TI3Q49`ztYIe>?A*CC!z3yy>etzH!#}RV z!ors?U-tF&{nsi0GO+5`mzM_)I20Cse0O(ubab@w)*U5Qwq|BxOxkk&=4NKI#26+x zH-3F`a&qZ+qhkNT|D znd+q~)cO7WeRFg3^be7S3=MBM*7WuDO`A4t(V|7Ux3{HcrJhXLw0gC6$?a=vqqpbW zObTIe$YZ_sFI6(;+M`F0E?l^rSFdi}y7lPejzDnCOPZUSUcGx))@b$O#mT?F zy?w^Qz_Dh3R$^jeNy(Q72b-(Ez4`b>ltE#G(SlX0UVVCc`eFN~O-9a43@l-6E{g-@ z@A5Hl=)g-OEIA)qWI+`j=;BIa#mYMTon758%}HL8>I@TX8%1v|-EaTt+1XQf z-6I}enpDWd5GfS#|L33F%%9n*t4#tJ6ttOMSBG;lC^R>Ib+-Ba?aSf)oAb{K3;z>i zR7hufeVF|^2ZO@mMpj%U5RyBHQUonu3Hk_B2otRc6beYCB9fbstV2=+H5gRpgG31` zLaG=*T0wfC)`7TC>qu1uvmLKVNQ#g`1SE=N9f%8c6HL+n69>AE$0{>4^srq!(vr=> zFySJiRs+=_FojIq3?MFk(@+(`s!KF0DO7|M3Ajx{QUtXf>TqN?VON9{Qy{I>Q3SOe z7MLJ|iH%N>RwOrpxKKA?iB8NUMu8%l$2Zg;P~Rb0ha;8-MSLSg0LbA4qY_`U3>sY^ zGe`{!kRE6fViAM4OhKYZCV{w6MIg6gw+_1^(!I$5u8A + + + + +
+