|
| 1 | +--- |
| 2 | +layout: post |
| 3 | +tags: blog |
| 4 | +title: "This month in Servo: Android nightlies, right-to-left, WebGPU, and more!" |
| 5 | +date: 2024-10-03 |
| 6 | +summary: Servo builds faster, runs faster, and gamepads are now enabled by default. |
| 7 | +categories: |
| 8 | +--- |
| 9 | + |
| 10 | +<figure class="_figr"><a href="{{ '/img/blog/september-2024.png' | url }}"><img src="{{ '/img/blog/september-2024.png' | url }}" |
| 11 | + alt="Servo nightly showing new support for <ul type>, right-to-left layout, ‘table-layout: fixed’, ‘object-fit’, ‘object-position’, crypto.getRandomValues(BigInt64Array) and (BigUint64Array), and innerText and outerText"></a></figure> |
| 12 | + |
| 13 | +<span class=_floatmin></span>Servo has had several new features land in our nightly builds over the last month: |
| 14 | + |
| 15 | +- as of 2024-09-10, we now support **<ul type>** and **<ul compact>** ([@simonwuelker](https://github.com/simonwuelker), [#33303](https://github.com/servo/servo/pull/33303)) |
| 16 | +- as of 2024-09-10, we now support **console.timeLog()** ([@simonwuelker](https://github.com/simonwuelker), [#33377](https://github.com/servo/servo/pull/33377)) |
| 17 | +- as of 2024-09-10, we now support the **encodeInto() method on TextEncoder** ([@webbeef](https://github.com/webbeef), [#33360](https://github.com/servo/servo/pull/33360)) |
| 18 | +- as of 2024-09-10, we now support **<link rel=prefetch>** ([@simonwuelker](https://github.com/simonwuelker), [#33345](https://github.com/servo/servo/pull/33345)) |
| 19 | +- as of 2024-09-12, we now support **right-to-left languages**, except for floats ([@mrobinson](https://github.com/mrobinson), [@atbrakhi](https://github.com/atbrakhi), [#33375](https://github.com/servo/servo/pull/33375)) |
| 20 | +- as of 2024-09-14, we now support **‘table-layout: fixed’** ([@Loirooriol](https://github.com/Loirooriol), [#33384](https://github.com/servo/servo/pull/33384), [#33442](https://github.com/servo/servo/pull/33442)) |
| 21 | +- as of 2024-09-17, we now support the **‘reset’ event on XRReferenceSpace** properties ([@mrobinson](https://github.com/mrobinson), [@Loirooriol](https://github.com/Loirooriol), [#33479](https://github.com/servo/servo/pull/33479)) |
| 22 | +- as of 2024-09-19, we now support the **‘object-fit’** and **‘object-position’** properties ([@mrobinson](https://github.com/mrobinson), [@Loirooriol](https://github.com/Loirooriol), [#33479](https://github.com/servo/servo/pull/33479)) |
| 23 | +- as of 2024-09-19, **Crypto.getRandomValues()** can now take **BigInt64Array** or **BigUint64Array** ([@msub2](https://github.com/msub2), [#33485](https://github.com/servo/servo/pull/33485)) |
| 24 | +- as of 2024-09-25, we now support **‘innerText’** and **‘outerText’ on HTMLElement** ([@Melchizedek6809](https://github.com/Melchizedek6809), [#33312](https://github.com/servo/servo/pull/33312)) |
| 25 | + |
| 26 | +Servo’s flexbox support continues to mature, with support for **‘align-self: normal’** ([@Loirooriol](https://github.com/Loirooriol), [#33314](https://github.com/servo/servo/pull/33314)), plus corrections to **cross-axis percent units** in descendants ([@Loirooriol](https://github.com/Loirooriol), [#33242](https://github.com/servo/servo/pull/33242)), **automatic minimum sizes** ([@Loirooriol](https://github.com/Loirooriol), [#33248](https://github.com/servo/servo/pull/33248), [#33256](https://github.com/servo/servo/pull/33256)), **replaced flex items** ([@Loirooriol](https://github.com/Loirooriol), [#33263](https://github.com/servo/servo/pull/33263)), **baseline alignment** ([@mrobinson](https://github.com/mrobinson), [@Loirooriol](https://github.com/Loirooriol), [#33347](https://github.com/servo/servo/pull/33347)), and **absolute descendants** ([@mrobinson](https://github.com/mrobinson), [@Loirooriol](https://github.com/Loirooriol), [#33346](https://github.com/servo/servo/pull/33346)). |
| 27 | + |
| 28 | +Our table layout has improved, with support for **width** and **height presentational attributes** ([@Loirooriol](https://github.com/Loirooriol), [#33405](https://github.com/servo/servo/pull/33405), [#33425](https://github.com/servo/servo/pull/33425)), as well as better handling of **‘border-collapse’** ([@Loirooriol](https://github.com/Loirooriol), [#33452](https://github.com/servo/servo/pull/33452)) and **extra <col> and <colgroup> columns** ([@Loirooriol](https://github.com/Loirooriol), [#33451](https://github.com/servo/servo/pull/33451)). |
| 29 | + |
| 30 | +We’ve also started working on the intrinsic sizing keywords **‘min-content’**, **‘max-content’**, **‘fit-content’**, and **‘stretch’** ([@Loirooriol](https://github.com/Loirooriol), [#33492](https://github.com/servo/servo/pull/33492)). |
| 31 | +Before we can support them, though, we needed to land patches to calculate intrinsic sizes, including for **percent units** ([@Loirooriol](https://github.com/Loirooriol), [#33204](https://github.com/servo/servo/pull/33204)), **aspect ratios** of replaced elements ([@Loirooriol](https://github.com/Loirooriol), [#33240](https://github.com/servo/servo/pull/33240)), **column flex containers** ([@Loirooriol](https://github.com/Loirooriol), [#33299](https://github.com/servo/servo/pull/33299)), and **‘white-space’** ([@Loirooriol](https://github.com/Loirooriol), [#33343](https://github.com/servo/servo/pull/33343)). |
| 32 | + |
| 33 | +We’ve also worked on our **WebGPU support**, with support for **pipeline-overridable constants** ([@sagudev](https://github.com/sagudev), [#33291](https://github.com/servo/servo/pull/33291)), and major rework to **GPUBuffer** ([@sagudev](https://github.com/sagudev), [#33154](https://github.com/servo/servo/pull/33154)) and our **canvas presentation** ([@sagudev](https://github.com/sagudev), [#33387](https://github.com/servo/servo/pull/33387)). |
| 34 | +As a result, **GPUCanvasContext** now properly supports (re)configuration and resize on **GPUCanvasContext** ([@sagudev](https://github.com/sagudev), [#33521](https://github.com/servo/servo/pull/33521)), presentation is now faster, and both are now more conformant with the spec. |
| 35 | + |
| 36 | +## Performance and reliability |
| 37 | + |
| 38 | +Servo now **sends font data over shared memory** ([@mrobinson](https://github.com/mrobinson), [#33530](https://github.com/servo/servo/pull/33530)), saving a huge amount of time over sending font data over IPC channels. |
| 39 | + |
| 40 | +We now debounce resize events for **faster window resizing** ([@simonwuelker](https://github.com/simonwuelker), [#33297](https://github.com/servo/servo/pull/33297)), limit **document title updates** ([@simonwuelker](https://github.com/simonwuelker), [#33287](https://github.com/servo/servo/pull/33287)), and use DirectWrite kerning info for **faster text shaping on Windows** ([@crbrz](https://github.com/crbrz), [#33123](https://github.com/servo/servo/pull/33123)). |
| 41 | + |
| 42 | +Servo has a new kind of **experimental profiling support** that can send profiling data to [Perfetto](https://ui.perfetto.dev) (on all platforms) and [HiTrace](https://github.com/openharmony/hiviewdfx_hitrace) (on OpenHarmony) via [`tracing`](https://tracing.rs) ([@delan](https://github.com/delan), [@atbrakhi](https://github.com/atbrakhi), [#33188](https://github.com/servo/servo/pull/33188), [#33301](https://github.com/servo/servo/pull/33301), [#33324](https://github.com/servo/servo/pull/33324)), and we’ve instrumented Servo with this in several places ([@atbrakhi](https://github.com/atbrakhi), [@delan](https://github.com/delan), [#33189](https://github.com/servo/servo/pull/33189), [#33417](https://github.com/servo/servo/pull/33417), [#33436](https://github.com/servo/servo/pull/33436)). |
| 43 | +This is in addition to Servo’s existing [HTML-trace-based profiling support](https://book.servo.org/hacking/profiling.html#generating-timelines). |
| 44 | + |
| 45 | +We’ve also added a new `profiling` Cargo profile that builds Servo with the recommended settings for profiling ([@delan](https://github.com/delan), [#33432](https://github.com/servo/servo/pull/33432)). |
| 46 | +For more details on building Servo for profiling, benchmarking, and other perf-related use cases, check out our updated [Building Servo](https://book.servo.org/hacking/building-servo.html#build-profiles) chapter ([@delan](https://github.com/delan), [book#22](https://github.com/servo/book/pull/22)). |
| 47 | + |
| 48 | +## Build times |
| 49 | + |
| 50 | +The first patch towards [**splitting up our massive `script` crate**](https://github.com/servo/servo/issues/1799) has landed ([@sagudev](https://github.com/sagudev), [#33169](https://github.com/servo/servo/pull/33169)), over ten years since that issue was first opened. |
| 51 | + |
| 52 | +`script` is the heart of the Servo rendering engine — it contains the HTML event loop plus all of our DOM APIs and their bindings to SpiderMonkey, and the script thread drives the page lifecycle from parsing to style to layout. |
| 53 | +`script` is also a monolith, with over 170 000 lines of hand-written Rust plus another 520 000 lines of generated Rust, and it has long dominated Servo’s build times to the point of being unwieldy, so it’s very exciting to see that we may be able to change this. |
| 54 | + |
| 55 | +Contributors to Servo can now enjoy faster **self-hosted CI runners** for our **Linux builds** ([@delan](https://github.com/delan), [#33321](https://github.com/servo/servo/pull/33321), [#33389](https://github.com/servo/servo/pull/33389)), cutting a typical **Linux-only build** from over half an hour to **under 8 minutes**, and a typical **[T-full](https://book.servo.org/contributing.html#running-tests-in-pull-requests) try job** from over an hour to **under 42 minutes**. |
| 56 | + |
| 57 | +We’ve now started exploring self-hosted macOS runners ([@delan](https://github.com/delan), [ci-runners#3](https://github.com/servo/ci-runners/pull/3)), and in the meantime we’ve landed several fixes for self-hosted build failures ([@delan](https://github.com/delan), [@sagudev](https://github.com/sagudev), [#33283](https://github.com/servo/servo/pull/33283), [#33308](https://github.com/servo/servo/pull/33308), [#33315](https://github.com/servo/servo/pull/33315), [#33373](https://github.com/servo/servo/pull/33373), [#33471](https://github.com/servo/servo/pull/33471), [#33596](https://github.com/servo/servo/pull/33596)). |
| 58 | + |
| 59 | +<figure class="_figl"><a href="{{ '/img/blog/servoshell-tabs-september-2024.png' | url }}"><img src="{{ '/img/blog/servoshell-tabs-september-2024.png' | url }}" |
| 60 | + alt="servoshell on desktop with improved tabbed browsing UI"></a></figure> |
| 61 | + |
| 62 | +<figure class="_figl" style="clear: left;"><a href="{{ '/img/blog/servoshell-android-september-2024.png' | url }}"><img src="{{ '/img/blog/servoshell-android-september-2024.png' | url }}" |
| 63 | + alt="servoshell on Android with new navigation UI"></a></figure> |
| 64 | + |
| 65 | +## <span class=_floatmin></span>Beyond the engine |
| 66 | + |
| 67 | +You can now **download [the Servo browser](https://book.servo.org/running-servoshell.html) for Android** on [servo.org](https://servo.org) ([@mukilan](https://github.com/mukilan), [#33435](https://github.com/servo/servo/pull/33435))! |
| 68 | +servoshell now **supports gamepads by default** ([@msub2](https://github.com/msub2), [#33466](https://github.com/servo/servo/pull/33466)), **builds for OpenHarmony** ([@mukilan](https://github.com/mukilan), [#33295](https://github.com/servo/servo/pull/33295)), and has **better navigation on Android** ([@msub2](https://github.com/msub2), [#33294](https://github.com/servo/servo/pull/33294)). |
| 69 | + |
| 70 | +**Tabbed browsing** on desktop platforms has become a lot more polished, with visible **close and new tab buttons** ([@Melchizedek6809](https://github.com/Melchizedek6809), [#33244](https://github.com/servo/servo/pull/33244)), **key bindings for switching tabs** ([@Melchizedek6809](https://github.com/Melchizedek6809), [#33319](https://github.com/servo/servo/pull/33319)), as well as better handling of **empty tab titles** ([@Melchizedek6809](https://github.com/Melchizedek6809), [#33354](https://github.com/servo/servo/pull/33354), [#33391](https://github.com/servo/servo/pull/33391)) and the **location bar** ([@webbeef](https://github.com/webbeef), [#33316](https://github.com/servo/servo/pull/33316)). |
| 71 | + |
| 72 | +We’ve also fixed **several HiDPI bugs** in servoshell ([@mukilan](https://github.com/mukilan), [#33529](https://github.com/servo/servo/pull/33529)), as well as **keyboard input** and scrolling on Windows ([@crbrz](https://github.com/crbrz), [#33225](https://github.com/servo/servo/pull/33225), [#33252](https://github.com/servo/servo/pull/33252)). |
| 73 | + |
| 74 | +## Donations |
| 75 | + |
| 76 | +Thanks again for your generous support! |
| 77 | +We are now receiving **4147 USD/month** (+34.7% over July) in recurring donations. |
| 78 | +This includes donations from **12 people** on LFX, but we will stop accepting donations there soon — **please move your recurring donations to [GitHub](https://github.com/sponsors/servo) or [Open Collective](https://opencollective.com/servo)**. |
| 79 | + |
| 80 | +Servo is also on [thanks.dev](https://thanks.dev), and already **eleven GitHub users** that depend on Servo are sponsoring us there. |
| 81 | +If you use Servo libraries like [url](https://crates.io/crates/url/reverse_dependencies), [html5ever](https://crates.io/crates/html5ever/reverse_dependencies), [selectors](https://crates.io/crates/selectors/reverse_dependencies), or [cssparser](https://crates.io/crates/cssparser/reverse_dependencies), signing up for [thanks.dev](https://thanks.dev) could be a good way for you (or your employer) to give back to the community. |
| 82 | + |
| 83 | +<figure class="_fig" style="width: 100%; margin: 1em 0;"><div class="_flex" style="height: calc(1lh + 3em); flex-flow: column nowrap; text-align: left;"> |
| 84 | + <div style="position: relative; text-align: right;"> |
| 85 | + <div style="position: absolute; margin-left: calc(100% * 4147 / 10000); padding-left: 0.5em;"><strong>4147</strong> USD/month</div> |
| 86 | + <div style="position: absolute; margin-left: calc(100% * 4147 / 10000); height: calc(1lh + 1.5em); border-left: 1px solid;"></div> |
| 87 | + <div style="position: absolute; margin-left: calc(100% - 0.5em); height: calc(1lh + 1.5em); border-left: 1px solid;"></div> |
| 88 | + <div style="padding-right: 1em;"><strong>10000</strong><!-- USD/month --></div> |
| 89 | + </div> |
| 90 | + <progress value="4147" max="10000" style="transform: scale(3); transform-origin: top left; width: calc(100% / 3);"></progress> |
| 91 | +</div></figure> |
| 92 | + |
| 93 | +With this money, we’ve been able to pay for our web hosting and self-hosted CI runners for Windows and Linux builds, and when the time comes, we’ll be able to afford macOS runners, perf bots, and maybe even an Outreachy intern or two! |
| 94 | +As always, use of these funds will be decided transparently in the Technical Steering Committee. |
| 95 | +For more details, head to our [Sponsorship page]({{ '/sponsorship/' | url }}). |
| 96 | + |
| 97 | +<style> |
| 98 | + /* guaranteed minimum width for first paragraph after a float */ |
| 99 | + ._floatmin { |
| 100 | + display: block; |
| 101 | + width: 13em; |
| 102 | + overflow: hidden; |
| 103 | + } |
| 104 | + ._none { |
| 105 | + display: none; |
| 106 | + } |
| 107 | + ._fig:not(#specificity) { |
| 108 | + width: 33em; |
| 109 | + max-width: 100%; |
| 110 | + margin: 1em auto; |
| 111 | + } |
| 112 | + ._fig > ._flex { |
| 113 | + display: flex; |
| 114 | + } |
| 115 | + ._fig table { |
| 116 | + text-align: initial; |
| 117 | + } |
| 118 | + ._fig figcaption._notes { |
| 119 | + text-align: left; |
| 120 | + width: max-content; |
| 121 | + max-width: 100%; |
| 122 | + } |
| 123 | + ._figl:not(#specificity), |
| 124 | + ._figr:not(#specificity) { |
| 125 | + margin: 0 1em 1em; |
| 126 | + } |
| 127 | + ._figl { |
| 128 | + float: left; |
| 129 | + max-width: 100%; |
| 130 | + } |
| 131 | + ._figr { |
| 132 | + float: right; |
| 133 | + max-width: 100%; |
| 134 | + } |
| 135 | + ._figl > figcaption, |
| 136 | + ._figr > figcaption, |
| 137 | + ._figl > iframe, |
| 138 | + ._figr > iframe, |
| 139 | + ._figl > video, |
| 140 | + ._figr > video, |
| 141 | + ._figl > a > img, |
| 142 | + ._figr > a > img { |
| 143 | + width: 21em; |
| 144 | + max-width: 100%; |
| 145 | + } |
| 146 | + ._runin { |
| 147 | + margin-bottom: 1em; |
| 148 | + } |
| 149 | + ._runin > p, |
| 150 | + ._runin > h2 { |
| 151 | + display: inline; |
| 152 | + } |
| 153 | + ._correction { |
| 154 | + max-width: 33em; |
| 155 | + margin: 1em auto; |
| 156 | + border-bottom: 1px solid; |
| 157 | + padding-bottom: 1em; |
| 158 | + } |
| 159 | + ._note { |
| 160 | + margin: 1em 1em; |
| 161 | + border-left: 1px solid; |
| 162 | + padding-left: 1em; |
| 163 | + opacity: 0.75; |
| 164 | + } |
| 165 | +</style> |
0 commit comments