自监督学习 可视化实验室

用交互式 SVG 呈现对比学习、掩码建模、BYOL、线性探测等自监督核心范式。八个模块,纯原生实现,探索无标注训练的核心结构。

zero-deps HTML / CSS / JS + SVG requestAnimationFrame prefers-reduced-motion
MODULE 01

对比学习范式 (SimCLR)

同一图像的两个增强视图互为正样本,batch 内其余样本为负样本。编码器 f 与投影头 g 将样本映射到潜在空间,通过 InfoNCE 拉近正样本、推开负样本。调节温度与负样本数观察对比强度。

simclr-contrast.svg
锚点 z_i 正样本 z_j 负样本 z_k 编码器/投影

SimCLR 前向流程

图像 x 经两次增强 t、t' 得到 x_i、x_j,共享编码器 f 提取表示 h,投影头 g 映射到 z 空间。InfoNCE 使正对相似度远高于负对。点击"重采样"观察潜在空间中正负样本几何关系。

Batch
256
负样本数
5
温度 τ
0.5
InfoNCE
—
MODULE 02

掩码图像建模 (MAE)

MAE 随机遮蔽图像 75% 的 patch,仅将可见 patch 送入 ViT encoder,轻量 decoder 从隐变量重建被遮蔽区域。调节遮蔽比例观察重建难度与可见 patch 数量变化。

mae-reconstruction.svg
可见 patch 遮蔽 patch 重建 patch

遮蔽策略

MAE 将图像切为 16×16 patch,按均匀分布随机采样 25% 保留,其余遮蔽。高遮蔽比例既减少计算量,又迫使模型学习全局结构。点击"重建动画"观察 decoder 逐步填补遮蔽区域。

总 patch
64
可见
16
遮蔽
48
遮蔽率
75%
MODULE 03

InfoNCE 损失曲面

InfoNCE = -log[ exp(sim⁺/τ) / Σ exp(sim_k/τ) ]。分子为正对相似度,分母为所有负对之和。温度 τ 控制分布锐度:τ 小则对比更"尖锐",τ 大则更平滑。观察 τ 与相似度对 softmax 权重的影响。

infonce-loss.svg

InfoNCE 公式

给定锚点 z_i、正样本 z_j 与 N 个负样本 z_k:

L = -log [ exp(sim(z_i,z_j)/τ) / (exp(sim(z_i,z_j)/τ) + Σ_k exp(sim(z_i,z_k)/τ)) ]

温度 τ 越小,模型对相似度差异越敏感,梯度集中于难负样本;τ 过大则趋近均匀分布,失去判别力。典型取值 0.07–0.5。

温度 τ
0.5
正对 sim⁺
0.80
softmax⁺
—
损失
—
MODULE 04

BYOL / SimSiam 无负样本

BYOL 仅用正样本对:在线网络(encoder+projector+predictor)预测目标网络输出,目标网络用 stop-gradient 且 EMA 更新,避免坍缩。SimSiam 用 stop-gradient + 批归一化实现相同目标。逐步观察前向数据流。

byol-simsiam.svg
在线网络 目标网络 stop-gradient 预测损失

前向数据流

x₁→在线网络→预测 p;x₂→目标网络(stop-grad)→z'。损失 = -cos(p, z')。目标网络参数为在线网络的 EMA。stop-gradient 阻止梯度回流到目标分支,是避免表征坍缩的关键。点击"逐步"观察各阶段。

阶段
0 / 4
stop-grad
开启
EMA 衰减
0.99
负样本
无
MODULE 05

线性探测评估

冻结预训练 encoder,在其特征上仅训练一个线性分类器。预训练 epoch 越多,特征线性可分性越好,linear probe 精度越高。调节预训练 epoch 观察特征聚类质量与精度的同步提升。

linear-probe.svg

线性可分性

左:冻结 encoder 提取特征;右:特征空间散点。epoch=0 时特征接近随机,类别混叠;随着自监督训练推进,同类聚集、异类分离,线性分类器精度持续上升。这是衡量表征质量的标准协议。

预训练 epoch
0
linear probe
—
特征维度
512
类别数
5
MODULE 06

数据增强策略

SimCLR 的关键在于强增强组合:随机裁剪、颜色抖动、高斯模糊、灰度化。增强强度直接影响正对难度与学到的不变性。逐项调节强度,观察增强视图与特征不变性。

augmentation.svg
原图 裁剪 颜色抖动 模糊 灰度

增强组合效应

单一增强往往不足,组合(crop+color+blur)才能提供足够"难度"。颜色抖动破坏颜色不变性迫使模型学习语义;裁剪迫使学习全局结构。强度过高会破坏语义,过低则任务过易。

Crop
0.8
Color
0.5
Blur
0.3
Gray
0.2
MODULE 07

特征空间可视化 (t-SNE)

用 t-SNE 将高维特征投影到 2D。预训练模型的特征按类别形成清晰簇,随机初始化则杂乱无章。切换两种状态,观察自监督学习对特征几何的重塑。

tsne-features.svg

特征几何对比

预训练特征:同类聚集成簇,异类边界清晰,线性可分。随机特征:各点均匀散布,无类别结构。t-SNE 保持高维局部邻域关系,簇结构是表征质量的直观证据。点击"动画过渡"观察两者形变。

模式
预训练
类别数
6
样本数
180
轮廓系数
—
MODULE 08

迁移学习效果

预训练模型在下游任务上微调,相比从头训练在低数据量下优势显著。调节下游数据量,对比两种策略的精度曲线与数据效率。自监督预训练将"表征学习"与"任务适配"解耦。

transfer-learning.svg
预训练 + 微调 从头训练 当前数据量

数据效率对比

在 1% 数据下,预训练模型已达 60%+ 精度,从头训练仅 20%。随数据量增加两者差距缩小,但预训练始终领先且收敛更快。这正是自监督学习的核心价值:利用无标注数据预获取通用表征。

数据量
10%
预训练精度
—
从头精度
—
提升
—