Rspress 2.0 გამოშვება: გამოცდილებისა და AI-ის ახალი განახლება
Rspress 2.0 გამოშვება: გამოცდილებისა და AI-ის ახალი განახლება
ჩვენ ძალიან ბედნიერები ვართ Rspress 2.0-ის ოფიციალური გამოშვების შესახებ!
Rspress არის Rsbuild-ზე დაფუძნებული სტატიკური საიტების გენერატორი, რომელიც სპეციალურად შექმნილია დეველოპერებისთვის დოკუმენტაციის საიტების ინსტრუმენტად. 2023 წელს ოფიციალურად გამოშვებიდან, Rspress 1.x-მა დააგროვა 144 ვერსია, რომელშიც მონაწილეობდა 125 კონტრიბუტორი პროექტის განვითარებაში. სულ უფრო მეტი დეველოპერი ირჩევს Rspress-ს, მისი ეფექტური კომპილაციის შესრულების, შეთანხმებული მარშრუტების და კომპონენტების ბიბლიოთეკის წინასწარი ჩვენების ფუნქციების წყალობით, რათა შექმნას ლამაზი და საიმედო დოკუმენტაციის საიტები.
კომუნიტეტის უკუკავშირის და რეკომენდაციების საფუძველზე, Rspress 2.0 კიდევ უფრო წინ წავიდა თემების სილამაზეში, AI-native ფუნქციებში, დოკუმენტების განვითარების გამოცდილებაში, Rslib-ის გამოყენების საკითხებში და სხვა.
რატომ Rspress 2.0
Rspress 1.x უკვე მოაგვარა დოკუმენტაციის საიტის ჩარჩოს კომპილაციის შესრულების პრობლემას, მაგრამ ჯერ კიდევ არსებობს რამდენიმე პრობლემა, რომელიც გავლენას ახდენს დოკუმენტების განვითარების ინსტრუმენტის ძირითად გამოცდილებაზე. 2.0 ვერსია არ შემოიფარგლება მხოლოდ კომპილაციის შესრულების ძიებით, არამედ ყურადღებას ამახვილებს დოკუმენტაციის საიტის გამოცდილების სხვა ასპექტებზე:
- თემის სტილი: ახალი მეტ漂亮ი დეფოლტ თემის ნაკრები, რომელიც გთავაზობთ მრავალფეროვან პერსონალიზაციის მეთოდებს, რაც აგვარებს 1.x-ის თემის პერსონალიზაციის სტაბილური API-ის ნაკლებობის პრობლემას.
- AI-native: დოკუმენტები არამხოლოდ ემსახურება ადამიანურ მკითხველებს, არამედ უნდა იყოს უკეთ გაგებული და გამოყენებული აგენტების მიერ. Rspress ახლა შეიცავს llms.txt გენერაციას და SSG-ისგან წარმოებულ SSG-MD ფუნქციას, რომელიც ქმნის მაღალი ხარისხის Markdown-rendered შინაარსს აგენტების წასაკითხად.
- მოთხოვნის მიხედვით კომპილაცია, წამიერი გაშვება: დეფოლტურად ჩართული lazyCompilation, რომელიც მუშაობს რესურსების preload ფუნქციასთან, მხოლოდ კონკრეტული მარშრუტების წვდომისას ქმნის საჭირო ფაილებს, რაც უზრუნველყოფს, რომ პროექტის ზომა არ აქვს მნიშვნელობა, dev-იც კი წამიერად გაშვება.
- Shiki კოდის ხაზგასმა: დეფოლტურად ინტეგრირებული Shiki, რომელიც კომპილაციის დროს ასრულებს სინტაქსის ხაზგასმას, მხარს უჭერს თემის შეცვლას, transformer-ის გაფართოებებს, როგორიცაა @rspress/plugin-twoslash, რაც უფრო მდიდარი კოდის ბლოკების ჩვენების ეფექტს ქმნის.
- დოკუმენტების განვითარების გამოცდილება: ოპტიმიზირებული nav.json, meta.json და სხვა ფაილების HMR და ახალი json schema IDE-ის შიგნით კოდის მითითებისთვის; დეფოლტურად ჩართული მკვდარი ბმულების შემოწმების ფუნქცია; ახალი ფაილის კოდის ბლოკის სინტაქსი, რომელიც მხარს უჭერს საგარეო ფაილების მითითებას; @rspress/plugin-preview და @rspress/plugin-playground ერთდროულად გამოყენების მხარდაჭერა და სხვა.
- Rslib ინტეგრაცია: ახლა შეგიძლიათ გამოიყენოთ create-rslib კომპონენტების ბიბლიოთეკის პროექტის შექმნისას, Rspress-ის არჩევა დოკუმენტაციის ინსტრუმენტად, რაც სწრაფად ქმნის კომპონენტების დოკუმენტაციის საიტებს.
2.0 ახალი ფუნქციები
სრულიად ახალი თემა
2.0 დეფოლტური თემა სისტემური განახლების პროცესშია, რომელიც მთლიანად შექმნილია გუნდის დიზაინერის @Zovn Wei მიერ, ვიზუალური ეფექტებისა და წაკითხვის გამოცდილების თვალსაზრისით მნიშვნელოვანი გაუმჯობესებით, და თითოეული კომპონენტი შეიძლება დამოუკიდებლად შეიცვალოს, რაც უზრუნველყოფს მაღალი პერსონალიზაციის დონეს.
თემის პერსონალიზაცია
პერსონალიზაციის დონით, რომელიც იწყება დაბალი დონიდან და მიდის მაღალ დონემდე, არსებობს CSS ცვლადები, BEM კლასის სახელები, ESM重导出覆盖, კომპონენტების eject ოთხი სახის პერსონალიზაციის მეთოდი.- CSS ვარიაბლები: ახალი თემა უფრო მეტ CSS ვარიაბლებს გამოტოვებს, რომლებიც მოიცავს თემის ფერს, კოდის ბლოკებს, მთავარი გვერდის და სხვა სტილებს. შეგიძლიათ CSS ვარიაბლების გვერდზე ინტერქტიულად დაათვალიეროთ და დაარეგულიროთ ყველა CSS ვარიაბლი, დააკოპიროთ თქვენთვის სასურველი კონფიგურაცია პროექტში გამოყენებისთვის.
- BEM კლასის სახელები: ინტეგრირებული კომპონენტები ახლა იყენებენ BEM სახელების სტანდარტს. ეს არის საკმაოდ ძველი სკოლის არჩევანი, მაგრამ ასევე ჩვენი კარგად გაწვდილი გადაწყვეტილება. მომხმარებლები შეუძლიათ CSS არჩევანის საშუალებით ზუსტად დაარეგულირონ სტილები, HTML სტრუქტურა უფრო ნათელია.
- ESM重导出覆盖: თუ CSS-ის ცვლილებები ვერ აკმაყოფილებს პერსონალიზაციის მოთხოვნებს, შეგიძლიათ JS-ის საშუალებით უფრო ღრმა პერსონალიზაცია მოახდინოთ. theme/index.tsx-ში ESM重导出-ის გამოყენებით, შეგიძლიათ დააფაროთ ნებისმიერი Rspress-ის ინტეგრირებული კომპონენტი.
- კომპონენტის გამოყვანა: შეგიძლიათ გამოიყენოთ სრულიად ახალი rspress eject [კომპონენტი] ბრძანება, ეს ბრძანება დააკოპირებს მითითებული კომპონენტის წყაროს კოდს theme/components/ დირექტორიაში, შეგიძლიათ თავისუფლად შეცვალოთ ეს კოდი, თუნდაც პირდაპირ AI-ს გადასცეთ, რათა მიიღოთ ღრმა პერსონალიზაცია.
ნავიგაციის ზოლი, გვერდითი ზოლი tag
Rspress 2.0-მა განახორციელა Tag კომპონენტი, ახლა შეგიძლიათ გამოიყენოთ frontmatter-ის tag თვისება, გვერდითი ზოლში ან ნავიგაციის ზოლში UI მარკირებისათვის.
ინტეგრირებული მრავალენოვანი მხარდაჭერა
1.x ვერსიაში, Rspress მხოლოდ ინგლისური ტექსტით იყო ინტეგრირებული, თუ სხვა ენების გამოყენება გსურთ, მაგალითად zh, ყველა ტექსტი უნდა იყოს კონფიგურირებული, რაც საკმაოდ რთულია. ახლა 2.0 თემა ინტეგრირებულია zh, en, ja, ko, ru და სხვა ენების თარგმანების ტექსტებით, სისტემა ავტომატურად მოახდენს "Tree Shaking" ენების კონფიგურაციის მიხედვით, მხოლოდ იმ ტექსტებისა და ენების შეკვრა, რომლებიც თქვენ იყენებთ.
llms.txt მხარდაჭერა
Rspress ახლა llms.txt გენერაციის შესაძლებლობას ინტეგრირებს core-ში და ახორციელებს სრულიად ახალ SSG-MD (Static Site Generation to Markdown, სტატიკური საიტის Markdown გენერაცია) შესაძლებლობას.
React-ის დინამიური რენდერის საფუძველზე შექმნილ ფრონტენდურ ჩარჩოებში ხშირად არსებობს სტატიკური ინფორმაციის ამოღების პრობლემა, Rspress-იც იმავე გამოწვევის წინაშე დგას. Rspress მომხმარებლებს საშუალებას აძლევს MDX ფრაგმენტების, React კომპონენტების, Hooks-ის და TSX მარშრუტების საშუალებით გააძლიერონ დოკუმენტის გამოხატულება. მაგრამ ეს დინამიური შინაარსი Markdown ტექსტად გადაქცევის დროს აწყდება შემდეგ პრობლემებს:
- MDX-ის პირდაპირ AI-ს მიწოდება მოიცავს დიდი რაოდენობით კოდის სინტაქსის ხმაურს და კარგავს React კომპონენტის შინაარსს
- HTML-ის Markdown-ში გადაქცევა ხშირად ცუდი შედეგით სრულდება, ინფორმაციის ხარისხი რთულია გარანტირებული
ამ პრობლემის გადასაჭრელად, Rspress 2.0-მა SSG-MD ფუნქცია შეიტანა. ეს არის სრულიად ახალი ფუნქცია, რომელიც მსგავსია სტატიკური საიტის გენერაციის (SSG), მაგრამ განსხვავება ისაა, რომ ის თქვენს გვერდებს Markdown ფაილებად რენდერებს, არა HTML ფაილებად, და გენერირებს llms.txt და llms-full.txt დაკავშირებულ ფაილებს.
Shiki კომპილირების დროს კოდის ბლოკების ხაზგასმაRspress 2.0 默认使用 Shiki 进行代码高亮。相比 1.x 的 prism 运行时高亮方案，Shiki 在编译时完成高亮处理。
- 支持多种主题样式，比如在 CSS 变量页面可以交互式地切换和预览不同的 Shiki 主题。
- 同时 Shiki 也允许使用自定义的 transformer 进行扩展来丰富写作，例如 twoslash 等。
- 按需引入编程语言，不增加运行时开销和包体积。
- 基于 TextMate 语法实现与 VS Code 一致的准确语法高亮。
构建性能提升
Rspress 2.0 底层由 Rsbuild 和 Rspack 2.0 预览版本驱动，同时默认开启了按需编译和持久化缓存。
按需编译
默认开启 dev.lazyCompilation，只有当你访问某个页面时，该页面才会被编译，大幅提升了开发启动速度，甚至实现毫秒级的冷启动。Rspress 同时实现了路由的 preload 策略，当鼠标悬停在链接上时会预先加载目标路由页面，搭配 lazyCompilation 实现无损的开发体验。
持久化缓存
2.0 同时默认开启了持久化缓存，在热启动中复用上次编译的结果，提升 30%-60% 的构建速度。这意味着在首次运行 rspress dev 或 rspress build 后，后续启动速度都会明显提升。
文档开发体验
默认开启死链检查
Rspress 2.0 默认开启死链检查功能。在构建过程中，会自动检测文档中的无效链接，帮助你及时发现和修复。
文件代码块
你可以使用 file="./path/to/file" 属性来引用外部文件作为代码块的内容，将示例代码放在单独的文件中维护。
preview 更灵活的 meta 用法
@rspress/plugin-preview 现在基于 meta 属性使用，更加灵活，也可以配合文件代码块。
Rslib & Rspress
在使用 create-rslib 创建项目时，你现在可以选择 Rspress 工具。这让你能够在开发组件库的同时，快速搭建配套的文档站点，用于编写组件的使用说明、展示 API 参考，或实时预览组件效果。
更多 Rspress 官方插件
Rspress 2.0 新增了多个官方插件：
- @rspress/plugin-algolia：支持替换 Rspress 的内置搜索为 Algolia DocSearch
- @rspress/plugin-twoslash：为 TypeScript 代码块添加类型提示
- @rspress/plugin-llms：为不支持 SSG 和 SSG-MD 的项目提供 llms.txt 生成能力
- @rspress/plugin-sitemap：自动生成 Sitemap 文件，用于优化 SEO
Breaking changes
从 Rspress 1.x 迁移
如果你是 1.x 项目的用户，我们准备了一份详尽的迁移文档，帮助你从 1.x 升级到 2.0。你可以直接使用页面中的 "复制 Markdown" 功能，将其输入给你常用的编码 agent（如 Claude Code 等）来完成迁移。### Node.js 与上游依赖版本要求
Rspress 2.0 要求 Node.js 版本 20+，React 版本 18+。
下一步
Rspress 2.0 的发布只是一个新的起点。本次发布后，Rspress 将持续迭代：
- 推进生态集成：与 Rslib、Rstest 更深度地结合，提供前端项目和组件库项目的一体化开发体验。
- 探索 AI 与文档更深度集成：如智能问答、自动摘要等；完善 SSG-MD 使其稳定并更加易用。
npm create rspress@latest
