xiaobuhui

1. Markdown 与 MDX 能力矩阵#

2. 动态表达式与数据映射#

MDX 允许在文件顶部使用 export const 声明作用域常量，可在行内求值或在模板中映射：

• 核心框架：Astro 7
• UI 引擎：Svelte 5
• 设计令牌：M3E Design Tokens
• 架构模式：孤岛架构

数组与集合可动态渲染为网格布局：

3. M3E 展示与布局原语（仅 SSR）#

根据 Shirone 的组件架构（docs/atomic-structure.md），无状态展示组件会输出干净、可访问的语义化 HTML，且不带客户端运行时负载。

4. 反馈与加载指示器#

Shirone 具备高保真的 Material 3 Expressive 动效与反馈原子：

5. 交互式 Svelte 5 孤岛#

使用 client:visible 声明的组件在进入视口时，会通过 IntersectionObserver 惰性注水：

6. Markdown 扩展兼容性#

Shirone 的 SSOT 统一插件管道保留了与所有 Markdown 扩展的完全兼容：

6.1 GitHub 仓库卡片#

saicaca/fuwari

flowchart TD
    MDX[MDX Source Entry] --> Compiler["@astrojs/mdx Compiler"]
    Compiler --> Plugins["Remark / Rehype SSOT Pipeline"]
    Plugins --> Islands["Svelte 5 Interactive Islands"]
    Islands --> Swup["Swup Client Navigation Shell"]
    Swup --> Screen["M3E Expressive Article View"]

7. 总结#

MDX 的原生集成让技术作者能够构建丰富、交互式的文档，同时保持 Shirone 极致快速的静态性能。所有组件都遵循 Material 3 Expressive 令牌设计系统，确保一致性、可访问性与视觉和谐。