Underline是一个Chrome浏览器扩展，旨在通过改变网页文本格式来提高阅读效率。该扩展通过增大句子首字母/首个字的大小和改变关键词的样式，帮助读者更快速地浏览和理解文本内容。

本扩展的设计基于多项阅读认知研究：

1. 视线固定与阅读速度：Just与Carpenter（1980）的研究表明，视线固定和阅读速度有着密切关系。通过强调句子的开头部分，可以帮助读者更快地定位和处理文本。

2. 模式识别理论：Reed（1973）提出的模式识别理论指出，人类大脑会先识别特征，然后确认各部分关系，最终形成对模式的解释。通过强调文本中的关键部分，可以加速这一识别过程。

3. 字词优势效应：Reicher（1969）的研究发现，识别单词中的某个字母的正确率要高于单独识别某个字母。这表明人脑在处理文本时，会利用上下文信息来加速理解。

4. 仿生阅读（Bionic Reading）：瑞典排版设计师Renato Casutt提出的仿生阅读技术，通过强调单词的首字母来引导视线，让大脑自动补全剩余部分，从而提高阅读速度。

虽然有研究（如Readwise的实验）表明仿生阅读可能不会显著提高所有人的阅读速度，但个体差异使得某些用户可能从中受益。我们的扩展允许用户根据个人偏好自定义文本格式，以找到最适合自己的阅读方式。

Underline扩展通过以下技术原理实现文本格式的增强：

扩展使用JavaScript的DOM API遍历网页中的所有文本节点，并对其进行处理。主要步骤包括：

1. 文本节点识别：使用TreeWalkerAPI遍历DOM树，找出所有文本节点。
2. 句子分割：根据标点符号（如句号、逗号、分号等）将文本分割成句子。
3. 首字母/首字增强：对于每个句子或单词，将首字母/首字包装在<span>元素中，并应用自定义样式。
4. DOM更新：将处理后的内容替换原始文本节点。

为了处理现代网页中的动态内容，扩展采用了多种策略：

1. MutationObserver：监听DOM变化，当新内容被添加到页面时自动处理。
2. 定期扫描：设置定时器定期检查页面是否有新内容需要处理。
3. 路由变化监听：监听URL和历史状态变化，以支持单页应用(SPA)。
4. 事件监听：监听页面加载完成事件，确保所有内容都被处理。

为了确保扩展不会影响网页性能，采用了以下优化措施：

1. 节点缓存：使用WeakSet存储已处理的节点，避免重复处理。
2. 延迟处理：使用setTimeout延迟处理大量内容，避免阻塞主线程。
3. 选择性处理：根据用户设置，选择性地处理或跳过特定类型的内容（如标题、代码块）。
4. 错误处理：全面的错误捕获和处理，确保即使出现问题也不会影响网页功能。

扩展通过Chrome的存储API管理用户设置：

1. 设置存储：使用chrome.storage.syncAPI存储用户设置，实现跨设备同步。
2. 实时应用：当用户更改设置时，立即应用到当前页面，无需刷新。
3. 默认配置：提供合理的默认设置，确保首次使用时也能获得良好体验。

这种实现方式使得扩展能够在不同类型的网站上工作，同时提供高度的可定制性和良好的性能。

1. 智能文本识别：自动识别网页中的正文内容，不影响标题、代码块和广告等非正文元素
2. 句首强调：增大句子首字母/首个字的大小或改变其颜色
   • 英文：强调单词的首字母
   • 中文：强调句子第一个字
3. 句子智能分割：基于逗号、句号、分号、问号等标点符号智能分割句子
4. 用户自定义设置：
   • 调整首字母/首字的大小比例
   • 自定义首字母/首字的颜色
   • 开启/关闭功能
5. 响应式设计：适应不同分辨率的设备显示

underline/
├── manifest.json        # 扩展配置文件
├── background.js        # 后台服务工作线程
├── content.js           # 内容脚本，处理网页内容
├── popup.html           # 弹出窗口HTML
├── popup.js             # 弹出窗口脚本
├── styles.css           # 样式文件
├── README.md            # 项目说明
├── INSTALL.md           # 安装指南
└── images/              # 图标和图像
    ├── icon.svg         # SVG格式图标
    ├── icon16.png       # 16x16像素图标
    ├── icon48.png       # 48x48像素图标
    ├── icon128.png      # 128x128像素图标
    └── README.md        # 图标转换说明

• Chrome浏览器（版本 88 或更高）
• 基本的Web开发知识（HTML, CSS, JavaScript）

1. 克隆仓库：

   git clone https://github.com/yourusername/underline.git
   

2. 在Chrome中加载扩展：

   • 打开 chrome://extensions/
   • 启用"开发者模式"
   • 点击"加载已解压的扩展程序"
   • 选择项目文件夹

3. 修改代码后重新加载扩展：

   • 在扩展管理页面点击"重新加载"按钮
   • 或者在扩展卡片上点击刷新图标

1. 确保所有图标文件都已生成（参见 images/README.md）
2. 压缩项目文件夹为ZIP文件
3. 在Chrome Web Store开发者控制台上传ZIP文件

1. 高级定制功能（付费版）：

   • 自定义首字母字体
   • 更多颜色主题选项
   • 关键词智能识别与强调
   • 阅读进度跟踪
   • 阅读统计分析

2. 性能优化：

   • 减少对网页加载速度的影响
   • 优化大型文档的处理效率

3. 多平台支持：

   • 扩展到Firefox等其他浏览器
   • 开发移动端应用

详细的安装步骤请参见 INSTALL.md。

• 对于长篇文章，建议将首字大小设置为120%-150%
• 根据不同的阅读环境（如日间/夜间）选择不同的颜色方案
• 对于技术文档，可以关闭该功能以保持代码格式的完整性

本扩展使用Manifest V3开发，遵循Chrome扩展的最佳实践。如果您想贡献代码或报告问题，请访问我们的GitHub仓库。

Underline尊重用户隐私，不会收集或存储任何个人信息或浏览数据。所有设置都存储在本地，不会上传到任何服务器。