🚀 AI Skylight 功能测试 — 代码高亮 / 图表 / 公式 / 评论
1. Prism.js 代码语法高亮
以下是一个 Python 机器学习示例:
import torch
import torch.nn as nn
class TransformerBlock(nn.Module):
"""Multi-head self-attention + FFN"""
def __init__(self, d_model=512, n_heads=8, d_ff=2048):
super().__init__()
self.attention = nn.MultiheadAttention(d_model, n_heads)
self.ffn = nn.Sequential(
nn.Linear(d_model, d_ff),
nn.GELU(),
nn.Linear(d_ff, d_model)
)
self.norm1 = nn.LayerNorm(d_model)
self.norm2 = nn.LayerNorm(d_model)
def forward(self, x):
attn_out, _ = self.attention(x, x, x)
x = self.norm1(x + attn_out)
ff_out = self.ffn(x)
return self.norm2(x + ff_out)
JavaScript 异步请求示例:
async function queryLLM(prompt, model = 'gpt-4') {
const response = await fetch('https://api.openai.com/v1/chat/completions', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
'Authorization': \`Bearer \${process.env.OPENAI_API_KEY}\`
},
body: JSON.stringify({
model,
messages: [{ role: 'user', content: prompt }],
temperature: 0.7
})
});
return response.json();
}
Shell 命令:
# 使用 vLLM 启动模型推理服务
python -m vllm.entrypoints.openai.api_server \
--model meta-llama/Llama-3-8B-Instruct \
--tensor-parallel-size 2 \
--max-model-len 4096 \
--port 8000
行内代码测试:使用 `torch.compile()` 可以显著提升 PyTorch 模型的推理速度。
2. Mermaid 图表渲染
下面是一个 RAG (Retrieval-Augmented Generation) 系统的架构图:
graph TD
A["📝 用户提问"] --> B["🔍 Query Encoder"]
B --> C["📚 向量数据库<br/>FAISS / Milvus"]
C --> D["📄 Top-K 文档检索"]
D --> E["🧠 LLM 生成器<br/>GPT-4 / Llama"]
A --> E
E --> F["💬 生成回答"]
G["📁 知识库文档"] --> H["✂️ 文档切分"]
H --> I["🔢 Embedding 模型"]
I --> C
3. KaTeX 数学公式
Transformer 自注意力机制:
$$\text{Attention}(Q, K, V) = \text{softmax}\left(\frac{QK^T}{\sqrt{d_k}}\right)V$$
其中 $Q$、$K$、$V$ 分别是查询、键、值矩阵,$d_k$ 是键向量的维度。
交叉熵损失函数:
$$\mathcal{L} = -\sum_{i=1}^{N} y_i \log(\hat{y}_i) + (1 - y_i) \log(1 - \hat{y}_i)$$
梯度下降更新规则:
$$\theta_{t+1} = \theta_t - \eta \cdot \nabla_{\theta} \mathcal{L}(\theta_t)$$
4. Giscus 评论系统
评论区在文章底部自动加载(需配置 GitHub 仓库后生效)。
5. 附加功能演示
💡 提示:本站使用 Ghost + Source 主题,集成了多种 AI 技术写作工具。阅读进度条在页面顶部实时显示。
| 功能 | 技术 | 用途 |
|---|---|---|
| 代码高亮 | Prism.js | Python / JS / Shell 等语法着色 |
| 图表渲染 | Mermaid | 流程图、时序图、架构图 |
| 数学公式 | KaTeX | LaTeX 公式渲染 |
| 评论系统 | Giscus | 基于 GitHub Discussions |
| 阅读进度 | 自定义 JS | 顶部进度条 |
| 自动目录 | 自定义 JS | 3+ 标题时自动生成 |