Skip to content

Rewrite yew.rs with Yew#4069

Draft
Madoshakalaka wants to merge 1 commit intomasterfrom
yew-docs
Draft

Rewrite yew.rs with Yew#4069
Madoshakalaka wants to merge 1 commit intomasterfrom
yew-docs

Conversation

@Madoshakalaka
Copy link
Member

@Madoshakalaka Madoshakalaka commented Mar 11, 2026

fixes #2779
Replace the Docusaurus-based website with a pure Rust/Yew implementation.

The SSG pipeline compiles each page to WASM, runs wasm-bindgen and wasm-opt, then captures SSR output for SEO-friendly HTML. All docs (5 versions x 4 languages), blog posts, community pages, search, and 404 are generated as static files.

This is a quite faithful rewrite of our old docusaurus based website.

Key features:

  • Content model with dual HTML/Markdown rendering which enables a copy-as-markdown button on each page (new feature)
  • Syntax highlighting via syntect (rust solution) with light/dark themes (old site used prism.js)
  • Collapsible sidebar, table of contents, breadcrumbs, and pagination (matching old site)
  • 3-state theme toggle (light/dark/system) (matching old site)
  • Blog with date-prefixed URLs, index, sidebar, RSS and Atom feeds (matching old site)
  • Full-page Algolia search with version faceting (matching old site)
  • OpenSearch descriptor, sitemap, robots.txt, 404 page (matching old site)
  • SEO: hreflang, OG tags, JSON-LD breadcrumbs, canonical URLs (matching old site)
  • wasm bundle and javascript hashing for cache control
  • CI workflow builds with Rust toolchain instead of Node.js

Some design choices and notes:

  • fantoccini is used for e2e testing the website. Site navigation needs to be tested because version + i18n selectors + side menu interaction can get very tricky. Alternatives to Fantoccini like thirtyfour, chromiumoxide were considered and Fantoccini has the most downloads, most stars, most recent release cadence.
  • Code snippet testing and tutorial testing preserved.
  • Data-as-code allows us to deduplicate greatly. Next and 0.23 docs are not diverged, which allows 0.23 docs to reuse the same data. This reduces 100, 000 lines of mdx to 50 ,000 lines of Rust.
  • stylist-rs is used for more concise styling. Its SSR support renders the same styling during SSG and runtime, causing no content flickering at all.
  • the new build tool, at ./yew-rs/ssg/, accepts page filtering, --jobs N flags, and --skip-wasm-opt flags that can shrink build time greatly. Since we don't have beefy runners and we do have to run wasm-opt in the CI, a fresh build might take one hour.
  • the new website uses stable yew (pinned to 0.23 at the moment) for cache friendliness.
  • Categories and subcategories all have {category}/introduction.mdx files. Most pages (7 out of 9) have a slug in the old mdx files so that the slug {category} by itself shows the introduction page, (and {category}/introduction gives a 404). The only two exceptions are: https://yew.rs/docs/next/getting-started/introduction and https://yew.rs/docs/advanced-topics/struct-components/introduction. The new code unifies the aliasing behaviour. It means old references to docs/next/getting-started/introduction and docs/advanced-topics/struct-components/introduction will hit 404.

Todos

  • Version and locale aware home pages. This is neccessary because the home page has yew features cards. The Get Started button and the Learn More buttons on each feature card consumes the version and locale too. Old site home page was not version aware (new feature)
  • binary size investigation. getting-started/examples and getting-started/editor-setup loads JavaScript of identical size but our "examples" page should be smaller because that page doesn't have codeblocks and we should not bundle syntect
  • Veriry localized and versioned home page SSG (important SEO optimization)
  • fix url descrepancy: shorter url maps to latest stable, "next/..." maps to latest.
  • add "older version", "next version" badges/alerts on top.
  • remove mdx refences from the workflow and the website directory.

@github-actions
Copy link

github-actions bot commented Mar 11, 2026

Size Comparison

Details
examples master (KB) pull request (KB) diff (KB) diff (%)
async_clock 101.056 101.056 0 0.000%
boids 168.881 168.902 +0.021 +0.013%
communication_child_to_parent 94.511 94.508 -0.003 -0.003%
communication_grandchild_with_grandparent 106.345 106.352 +0.007 +0.006%
communication_grandparent_to_grandchild 102.690 102.691 +0.001 +0.001%
communication_parent_to_child 91.919 91.919 0 0.000%
contexts 106.417 106.412 -0.005 -0.005%
counter 87.231 87.231 0 0.000%
counter_functional 89.267 89.269 +0.002 +0.002%
dyn_create_destroy_apps 91.147 91.147 0 0.000%
file_upload 100.326 100.324 -0.002 -0.002%
function_delayed_input 95.238 95.242 +0.004 +0.004%
function_memory_game 174.100 174.104 +0.004 +0.002%
function_router 395.810 394.940 -0.869 -0.220%
function_todomvc 165.387 165.396 +0.009 +0.005%
futures 235.984 235.981 -0.003 -0.001%
game_of_life 105.532 105.532 0 0.000%
immutable 260.574 260.573 -0.001 -0.000%
inner_html 81.774 81.774 0 0.000%
js_callback 110.396 110.396 -0.001 -0.001%
keyed_list 180.710 180.709 -0.001 -0.001%
mount_point 85.147 85.147 0 0.000%
nested_list 114.095 114.091 -0.004 -0.003%
node_refs 92.521 92.521 0 0.000%
password_strength 1719.354 1719.396 +0.043 +0.002%
portals 93.994 93.995 +0.001 +0.001%
router 366.460 365.598 -0.862 -0.235%
suspense 114.396 114.395 -0.001 -0.001%
timer 89.369 89.369 0 0.000%
timer_functional 99.805 99.807 +0.002 +0.002%
todomvc 143.096 143.096 0 0.000%
two_apps 87.145 87.145 0 0.000%
web_worker_fib 137.050 137.049 -0.001 -0.001%
web_worker_prime 188.234 188.232 -0.002 -0.001%
webgl 83.920 83.922 +0.002 +0.002%

✅ None of the examples has changed their size significantly.

@Madoshakalaka Madoshakalaka added documentation A-ci Area: The continuous integration labels Mar 11, 2026
@Madoshakalaka Madoshakalaka force-pushed the yew-docs branch 2 times, most recently from 832800f to 0ec8ecd Compare March 11, 2026 12:24
@github-actions
Copy link

github-actions bot commented Mar 11, 2026

Visit the preview URL for this PR (updated for commit 15b5594):

https://yew-rs--pr4069-yew-docs-185gwe7t.web.app

(expires Sat, 21 Mar 2026 13:47:49 GMT)

🔥 via Firebase Hosting GitHub Action 🌎

Madoshakalaka added a commit that referenced this pull request Mar 13, 2026
Replace the Docusaurus-based website with a pure Rust/Yew implementation.

The SSG pipeline compiles each page to WASM, runs wasm-bindgen and
wasm-opt, then captures SSR output for SEO-friendly HTML. All docs
(5 versions x 4 languages), blog posts, community pages, search, and
404 are generated as static files.

Key features:
- Content model with dual HTML/Markdown rendering for copy-as-markdown
- Syntax highlighting via syntect with light/dark themes
- Collapsible sidebar, table of contents, breadcrumbs, pagination
- 3-state theme toggle (light/dark/system)
- Blog with date-prefixed URLs, index, sidebar, RSS and Atom feeds
- Full-page Algolia search with version faceting
- SEO: hreflang, OG tags, JSON-LD breadcrumbs, canonical URLs
- E2E tests with fantoccini/geckodriver
- Deduplicated versioned docs across 0.20/0.21/0.22/0.23/next
Madoshakalaka added a commit that referenced this pull request Mar 13, 2026
Replace the Docusaurus-based website with a pure Rust/Yew implementation.

The SSG pipeline compiles each page to WASM, runs wasm-bindgen and
wasm-opt, then captures SSR output for SEO-friendly HTML. All docs
(5 versions x 4 languages), blog posts, community pages, search, and
404 are generated as static files.

Key features:
- Content model with dual HTML/Markdown rendering for copy-as-markdown
- Syntax highlighting via syntect with light/dark themes
- Collapsible sidebar, table of contents, breadcrumbs, pagination
- 3-state theme toggle (light/dark/system)
- Blog with date-prefixed URLs, index, sidebar, RSS and Atom feeds
- Full-page Algolia search with version faceting
- SEO: hreflang, OG tags, JSON-LD breadcrumbs, canonical URLs
- E2E tests with fantoccini/geckodriver
- Deduplicated versioned docs across 0.20/0.21/0.22/0.23/next
@Madoshakalaka Madoshakalaka force-pushed the yew-docs branch 5 times, most recently from 82d0745 to ce3a6d7 Compare March 14, 2026 11:41
@Madoshakalaka
Copy link
Member Author

@WorldSEnder still a draft PR but any opinions are welcome. you can already try the wasm website in the preview URL

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

A-ci Area: The continuous integration documentation

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Build Yew website with Yew

1 participant