190 lines
4.4 KiB
Markdown
190 lines
4.4 KiB
Markdown
---
|
|
marp: true @marp-team/marp-cli v4.4.0 (w/ @marp-team/marp-core v4.3.0)
|
|
title: Firefox Web APIs with crates over FFI
|
|
author: Ed Guloien
|
|
date: Sept 2026
|
|
paginate: true
|
|
footer: <span> <img src="images/qb-logo-mark.png" width="60"/> Sept 2026 </span>
|
|
html: "true"
|
|
---
|
|
<!-- all slideshow styling in one place -->
|
|
<style>
|
|
/* font setup */
|
|
section {
|
|
@font-face {
|
|
font-family: 'Montserrat';
|
|
font-weight: 400;
|
|
src: url('./fonts/Montserrat-Regular.woff2') format('woff2');
|
|
}
|
|
@font-face {
|
|
font-family: 'Montserrat';
|
|
font-weight: 700;
|
|
src: url('./fonts/Montserrat-Bold.woff2') format('woff2');
|
|
}
|
|
font-family: 'Montserrat', sans-sarif;
|
|
}
|
|
footer { width: 100%; text-align: left; }
|
|
|
|
/* title setup */
|
|
h1 { color: #4ca783; border-bottom: 2px solid #fc8a09;}
|
|
|
|
/* general title and text setup */
|
|
h2 { color: #4ca783; position: absolute; top: 50px; left: 60px;
|
|
border-bottom: 2px solid #fc8a09; }
|
|
section { font-family: 'Montserrat', sans-serif; color: #5d5d5c }
|
|
|
|
/* references setup */
|
|
h4 { color: #4ca783; position: absolute; top: 100px; left: 60px;
|
|
border-bottom: 2px solid #fc8a09;
|
|
margin-top: 200px; }
|
|
p { margin-top: 300px; font-family: 'Montserrat', sans-serif; }
|
|
</style>
|
|
|
|
# Firefox Web APIs with Crates (over FFI)
|
|
|
|
### Ed Guloien
|
|
|
|
<!-- disable page numbering on title page -->
|
|
<!-- _paginate: false -->
|
|
|
|
---
|
|
|
|
## about://ed-guloien
|
|
|
|
<style scoped>
|
|
.container { display: grid;
|
|
grid-template-columns: 1fr 320px; grid-template-rows: auto 1fr;
|
|
gap: 24px; height: 100%;
|
|
margin-top: 60px;}
|
|
.logos {
|
|
grid-column: 1; grid-row: 2; display: flex; gap: 20px; align-items: center; }
|
|
.bio {
|
|
grid-column: 1; grid-row: 1; }
|
|
.bio ul {
|
|
list-style: none; padding: 0; margin: 0; line-height: 1.8; }
|
|
.headshot {
|
|
grid-column: 2; grid-row: 1 / 3; align-items: center; justify-content: left; }
|
|
.headshot img { width: 600px; border-radius: 8px; }
|
|
</style>
|
|
<div class="container">
|
|
<div class="logos">
|
|
<img src="images/qb-logo-text.png" width="250px">
|
|
<img src="images/fx-browser-logo.jpg" width="250px">
|
|
</div>
|
|
<div class="bio">
|
|
<ul>
|
|
<li> Software Developer @ Quantum Bridge: </li>
|
|
<li> Distributed Symmetric Key Exchange </li>
|
|
<li> Former Mozillian: Platform, Networking</li>
|
|
<li> Interests: Privacy, Security, Systems</li>
|
|
<li> ed.guloien@qubridge.io </li>
|
|
</ul>
|
|
</div>
|
|
<div class="headshot">
|
|
<img src="images/headshot.jpeg" width="250px">
|
|
</div>
|
|
</div>
|
|
|
|
---
|
|
## Interop 2025
|
|
|
|
|
|
|
|
|
|
---
|
|
## URLPattern Web API
|
|
|
|
```rust
|
|
// JS
|
|
// build a pattern
|
|
const pattern = new URLPattern({ pathname: "/books/:id" });
|
|
|
|
// check for match
|
|
pattern.test("https://example.com/books/123");
|
|
|
|
// get match info by component
|
|
pattern.exec("https://example.com/books/123").pathname.groups
|
|
```
|
|
|
|
---
|
|
## Denoland & Firefox
|
|
|
|
|
|
|
|
|
|
|
|
-------
|
|
## Web API Call Flow
|
|
|
|
|
|
|
|
-----
|
|
## Urlpattern Crate API
|
|
|
|
|
|
|
|
----
|
|
## Glue Crate
|
|
|
|
```
|
|
let pattern = quirks::parse::<SpiderMonkeyRegexp>(input);
|
|
let results = quirks::process_match(pattern, input);
|
|
|
|
// call it a day
|
|
```
|
|
|
|
-----
|
|
## Reality Sets In (Memory Concerns)
|
|
|
|
```
|
|
#[repr(transparent)]
|
|
pub struct UrlPatternGlue(pub *mut c_void);
|
|
|
|
|
|
if let Ok(pattern) = quirks::parse::<SpiderMonkeyRegexp>(input, ...) {
|
|
unsafe {
|
|
*res = UrlPatternGlue(Box::into_raw(Box::new(pattern)) as *mut _);
|
|
}
|
|
}
|
|
|
|
|
|
glue::process_match(..., res: *mut MatchResults, other: MaybeString)
|
|
|
|
|
|
glue::doing_thing(..., res: &mut ThinVec<>);
|
|
```
|
|
|
|
----
|
|
## Pattern Re-use; Marshaling
|
|
|
|
|
|
|
|
------
|
|
## 99.8%
|
|
|
|
```
|
|
regex::Regex != EcmaScript Regex
|
|
```
|
|
|
|
----
|
|
## Spidermonkey Challenges (many)
|
|
|
|
|
|
|
|
|
|
-----
|
|
## Phew!
|
|
|
|
|
|
|
|
|
|
<style scoped> img { position: absolute; top: 150px; left: 15%; } </style>
|
|
|
|
#### References
|
|
- http://qubridge.io
|
|
- https://wpt.fyi/interop-2025
|
|
- https://developer.mozilla.org/en-US/docs/Web/API/URL_Pattern_API
|
|
- https://searchfox.org/firefox-main
|
|
- https://github.com/denoland/rust-urlpattern
|
|
- See also: https://manuelbucher.com/blog/rust-gecko/
|