Hacktoberfest 2026:メンテナが10月に向けて印を付けた、オープンで初心者向けの issue。 Hacktoberfest の issue を見る

perf(syntax-lookup): optimize catalog search and detail routes

オープン
#1,376 コメント 0 件 リアクション 0 件 担当者 0 名 GitHub で見る

メンテナーはふだん 2 日以内に返信

まだ誰も着手していません。

評価

難易度
5/5
見積もり時間
1週間以上
初心者へのやさしさ
30/100
issue の種類
リファクタリング
明瞭さ
おおむね明確
活発さ
活発
技術スタック
cypress, react

調査の方向性

Start with the /syntax-lookup and representative detail routes, using the production-artifact baseline from #1371 after the homepage stack lands on master. Profile catalog and detail assets, loader data, DOM/media counts, and query costs separately, then run the named ReScript compilation, production build, focused Vitest/Cypress coverage, and #1371 route report. Done means the listed navigation, highlighting, media, payload, and console-error acceptance criteria pass without visual snapshot updates.

索引モデルが issue の本文から書いたものです。

説明

enhancement react syntax lookup

Context

The syntax lookup is both a large catalog search surface and a collection of MDX detail pages under the docs layout. Its catalog loader serializes the complete item set, builds a local Fuse index, and can render many tags; detail routes instead render compiled MDX. Optimize these two shapes together only where they share real behavior, while keeping their individual profiles visible.

The homepage work already moved syntax grammar registration to the content boundary (#1365). Retain that boundary; this ticket concerns catalog data, interactive rendering, and detail-page payloads.

Representative profiles

  • /syntax-lookup
  • A typical detail route such as /syntax-lookup/decorator_as
  • A detail route reached after a catalog query

Use the production-artifact baseline from #1371 after the homepage stack lands on master.

Suggested PR stack

  • Add catalog and detail profiles plus browser coverage for direct loads, query changes, category filtering, result-to-detail navigation, back/forward behavior, code-copy/highlighting, and docs sidebar/TOC navigation.
  • Measure catalog loader serialization, local index construction, unfiltered DOM size, and query-response work independently. Make index creation and filtering stable across renders, and defer or partition expensive client work only if the initial catalog remains useful and accessible.
  • Profile the detail loader/MDX payload and prerender static code presentation where it removes client work without compromising anchors, code tabs, copy controls, or content-boundary highlighting.
  • Audit catalog/detail media for intrinsic dimensions and priority; use responsive sources only for actual large raster placements.
  • Split optional syntax-lookup interaction code at activation boundaries and apply existing React Compiler annotations only to stable leaf components with artifact and browser coverage.

Acceptance criteria

  • Catalog and detail pages report separate, reproducible initial assets, loader-data sizes, DOM/media counts, and post-query costs; every stack layer records its delta against the immediate target.
  • Querying, category filters, result ordering, direct detail URLs, client navigation, back/forward, docs navigation, syntax highlighting, and code interaction work without hydration or console errors.
  • Initial routes do not regain homepage, playground/compiler, or eager DocSearch implementation payloads; DocSearch remains activation-loaded.
  • Every rendered image/video has numeric intrinsic dimensions and below-fold media is not needlessly preloaded.
  • ReScript compilation, production build, focused Vitest/Cypress coverage, and the #1371 route report pass. Do not update visual snapshots without approval.

Relates to #1354 and depends on #1371 for the common measurement contract.

主要言語
MDX
スター
1.9k
フォーク
261
平均マージ
3日 13時間
マージ済み PR(30日)
37

環境構築

はじめの一歩

  1. issue を最後まで読み、次にプロジェクトのコントリビューションガイドを読みます。
  2. 着手することを issue にコメントします — 二人が同じ作業をするのを防げます。
  3. リポジトリをフォークし、ブランチを切って変更します。
  4. issue 番号を参照したプルリクエストを送ります。

rescript-lang/rescript-lang.org のほかの issue

rescript-lang/rescript-lang.org の issue をすべて見る

似ている issue

Documentation の issue をもっと見る

新しい issue をメールで受け取る

初心者向けの GitHub issue を短くまとめたダイジェスト。