从0到1掌握DOM Distiller:Chrome阅读器模式核心技术完全指南
从0到1掌握DOM DistillerChrome阅读器模式核心技术完全指南【免费下载链接】dom-distillerDistills the DOM项目地址: https://gitcode.com/gh_mirrors/do/dom-distillerDOM Distiller是Chrome阅读器模式的核心技术它通过提取网页核心文本并剥离非必要内容为文章和类文章网页提供更优质的阅读体验。作为开源项目它不仅驱动着Chrome Android和桌面版的阅读器模式还支持Chrome iOS上的阅读列表功能是提升网页阅读体验的终极解决方案。 什么是DOM DistillerDOM Distiller本质上是一个网页内容提炼工具它能够智能识别网页中的核心内容如文章正文、图片并过滤掉广告、导航栏、侧边栏等干扰元素。该项目松散基于Boilerpipe技术开发专注于提供简洁、专注的阅读环境。目前DOM Distiller已被广泛应用于多个项目和功能中Chrome Android和桌面版的阅读器模式Chrome iOS上的阅读列表功能 如何在Chrome中使用阅读器模式安卓设备使用方法阅读器模式已在Android版Chrome中正式发布任何更新到最新版本的Chrome都能使用访问非移动友好的文章页面当屏幕底部出现显示简化视图信息栏时点击它即可如需启用该功能可能需要先在辅助功能设置中开启桌面版Chrome使用步骤桌面版Chrome的阅读器模式仍在开发中截至M80版本可通过以下步骤激活实验性预览打开桌面版Chrome浏览器导航至chrome://flags使用页面内搜索框搜索enable-reader-mode 或者直接访问chrome://flags#enable-reader-mode点击下拉框并选择已启用出现提示时点击页面底部的立即重启访问文章或类文章页面地址栏会出现阅读器模式图标点击即可进入 DOM Distiller的核心技术原理DOM Distiller的工作流程主要包括以下几个关键步骤1. 内容提取DOM Distiller通过分析网页DOM结构识别并提取核心内容块。这一过程主要由java/org/chromium/distiller/extractors/ArticleExtractor.java实现它使用多种启发式算法来区分内容和非内容元素。2. 内容过滤提取内容后系统会应用一系列过滤器去除冗余信息。关键过滤器包括BoilerplateBlockFilter.java过滤样板内容MinWordsFilter.java过滤字数过少的内容块KeepLargestBlockFilter.java保留最大的内容块3. 内容优化最后系统会对提取的内容进行优化包括标题识别与提取段落重组图片优化格式标准化 如何搭建DOM Distiller开发环境前提条件在开始之前确保安装以下依赖Google Chrome浏览器Git工具获取代码切换到你想要存放代码的目录不要放在Chromium主 checkout 目录内克隆仓库git clone https://gitcode.com/gh_mirrors/do/dom-distiller代码将位于新创建的dom-distiller文件夹中安装git hooks进入项目目录并运行./create-hook-symlinksUbuntu/Debian系统额外步骤在dom-distiller文件夹中运行sudo ./install-build-deps.shMac OS X系统额外步骤安装JDK 7安装Homebrew使用Homebrew安装必要工具brew install ant python brew install protobuf --with-python安装Python依赖sudo easy_install pip pip install --user selenium 构建与测试DOM DistillerDOM Distiller使用ant作为构建工具所有可用目标可以通过ant -p列出。常用构建命令ant test运行所有测试ant gwtc将.class和.java文件编译为JavaScript生成的独立JavaScript位于war/domdistiller/domdistiller.nocache.jsant extractjs创建独立JavaScript文件输出到out/domdistiller.jsant package将主要构建产物复制到out/package文件夹运行测试可以使用以下命令运行特定测试ant test -Dtest.filter*.FilterTest.*:*Foo*-*Bar* 调试DOM Distiller交互式调试使用Chrome开发者工具调试DOM Distiller运行ant extractjs.jstests或ant test更新测试JavaScript在Chrome中打开war/test.html打开开发者工具的Console面板Ctrl-Shift-J或Cmd-Option-I运行所有测试org.chromium.distiller.JsTestEntry.run()运行特定测试org.chromium.distiller.JsTestEntry.runWithFilter(MyTestClass.testSomething)开发者扩展ant package会在out/extension下生成一个未打包的Chrome扩展添加方法如下访问chrome://extensions启用开发者模式选择加载已解压的扩展并指向out/extension文件夹该扩展支持分析提取代码并在开发者工具中添加了一个面板可用于在被检查的页面上触发提取。 贡献代码DOM Distiller使用Chromium的协作工具代码审查托管在Chromium Gerrit上。贡献代码前需要安装depot_tools。代码格式化提交代码前请运行以下命令以遵循DOM Distiller的代码格式指南git cl format提交变更创建新的本地分支并提交更改运行git cl upload将更改上传到Chromium Gerrit等待审核通过后点击Submit to CQ合并更改 常见问题解答如何报告bugbug和功能请求在Chromium的issue跟踪器中进行跟踪DOM Distiller的bug请提交到component:UIBrowserReaderMode。应报告的bug类型包括崩溃、错误页面和其他类似技术问题提取质量差如非必要图片或缺失文本阅读器模式在不应出现的页面上提供如登录页面或在应出现的页面上不提供如新闻文章如何在Chrome中运行DOM Distiller设置环境变量export CHROME_SRC/path/to/chromium/src export DOM_DISTILLER_DIR/path/to/dom-distiller运行ant package并将生成的文件复制到Chrome中构建并运行Chromeautoninja -C out/Debug chrome out/Debug/chrome --enable-dom-distiller通过以上指南你现在已经掌握了DOM Distiller的核心概念、使用方法和开发流程。无论是作为普通用户享受更优质的阅读体验还是作为开发者参与项目贡献DOM Distiller都为你提供了简单而强大的工具和技术。开始探索这个令人惊叹的项目体验网页内容提炼的强大能力吧【免费下载链接】dom-distillerDistills the DOM项目地址: https://gitcode.com/gh_mirrors/do/dom-distiller创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考

相关新闻

Burpsuite下载CA证书及安装教程

Burpsuite下载CA证书及安装教程

Burpsuite要抓取https流量包,计算机需要安装Burpsuite的CA证书,步骤如下:1:burpsuite打开代理设置,按图中顺序操作2:按照图中所示下一步操作 3:在输入框里给导出证书命名,后缀为der,…

2026/10/2 6:38:08 阅读更多 →
刑事附带民事案件怎么找合适律师 赔偿主张与代理服务要点全面梳理

刑事附带民事案件怎么找合适律师 赔偿主张与代理服务要点全面梳理

‍一、前言很多人碰到刑事附带民事案件时都容易犯难:一边盯着被告人的刑事责任追究进度,怕对方轻判漏罚;一边算着自己的医疗费、误工费、财物损失,怕该拿的赔偿拿不到手。不少人要么找了只懂刑事辩护的律师,对赔偿项目…

2026/10/12 19:09:24 阅读更多 →
Playnite游戏库管理器完整攻略:告别多平台切换,一个界面统一所有游戏

Playnite游戏库管理器完整攻略:告别多平台切换,一个界面统一所有游戏

Playnite游戏库管理器完整攻略:告别多平台切换,一个界面统一所有游戏 【免费下载链接】Playnite Video game library manager with support for wide range of 3rd party libraries and game emulation support, providing one unified interface for yo…

2026/10/3 4:05:26 阅读更多 →

最新新闻

U-Net论文笔记:编码-解码结构与跳跃连接在医学图像分割中的应用

U-Net论文笔记:编码-解码结构与跳跃连接在医学图像分割中的应用

/* MD / 富文本中的 .toc(含博客园搬家等嵌套结构);.toc-box 在侧栏,不受影响 */#content_views .toc,/* 编辑器常在目录前后插入空 p(:empty 仍占 20px),一并去掉避免顶空隙 */#content_views.markdown_views > p:empty:has(+ .toc),#content_views.markdown_views …

2026/10/14 20:05:13 阅读更多 →
孩子站在父母上面?家庭权力失衡的代价与修复指南

孩子站在父母上面?家庭权力失衡的代价与修复指南

你有没有见过这样的场景:五六岁的孩子因为妈妈没有及时递上水杯,当众对着妈妈又推又喊;妈妈非但不生气,反而赔着笑脸安抚:“他脾气大,顺着就好。”又或者,饭桌上孩子一撅嘴说不吃这个菜&#xf…

2026/10/14 20:05:13 阅读更多 →
多数元素算法的工程本质:从LeetCode到CPU缓存与JVM调优

多数元素算法的工程本质:从LeetCode到CPU缓存与JVM调优

/* MD / 富文本中的 .toc(含博客园搬家等嵌套结构);.toc-box 在侧栏,不受影响 */#content_views .toc,/* 编辑器常在目录前后插入空 p(:empty 仍占 20px),一并去掉避免顶空隙 */#content_views.markdown_views > p:empty:has(+ .toc),#content_views.markdown_views …

2026/10/14 20:05:13 阅读更多 →
嵌入式HTTP客户端自研:状态机与流式解析实战

嵌入式HTTP客户端自研:状态机与流式解析实战

/* MD / 富文本中的 .toc(含博客园搬家等嵌套结构);.toc-box 在侧栏,不受影响 */#content_views .toc,/* 编辑器常在目录前后插入空 p(:empty 仍占 20px),一并去掉避免顶空隙 */#content_views.markdown_views > p:empty:has(+ .toc),#content_views.markdown_views …

2026/10/14 20:05:13 阅读更多 →
STM32寄存器白话手册:从地址映射到位操作实战

STM32寄存器白话手册:从地址映射到位操作实战

/* MD / 富文本中的 .toc(含博客园搬家等嵌套结构);.toc-box 在侧栏,不受影响 */#content_views .toc,/* 编辑器常在目录前后插入空 p(:empty 仍占 20px),一并去掉避免顶空隙 */#content_views.markdown_views > p:empty:has(+ .toc),#content_views.markdown_views …

2026/10/14 20:05:13 阅读更多 →
软件测试核心指南:从目的原则到BUG生命周期全解析

软件测试核心指南:从目的原则到BUG生命周期全解析

/* MD / 富文本中的 .toc(含博客园搬家等嵌套结构);.toc-box 在侧栏,不受影响 */#content_views .toc,/* 编辑器常在目录前后插入空 p(:empty 仍占 20px),一并去掉避免顶空隙 */#content_views.markdown_views > p:empty:has(+ .toc),#content_views.markdown_views …

2026/10/14 20:04:12 阅读更多 →

日新闻

AnyPS5通用适配层设计:兼容性与性能的工程取舍

AnyPS5通用适配层设计:兼容性与性能的工程取舍

1. 从"AnyPS5"这个名字说起:它到底想解决什么问题第一次看到"AnyPS5"这个标题,我脑子里冒出来的第一个念头是:这大概率是一个围绕"跨平台运行"或者"通用适配"做文章的项目。名字里的"Any"…

2026/10/14 0:00:41 阅读更多 →
Flutter跨平台开发实战:二手交易应用与HarmonyOS适配

Flutter跨平台开发实战:二手交易应用与HarmonyOS适配

1. 项目概述:Flutter跨平台二手交易应用开发作为一名长期从事移动应用开发的工程师,我最近完成了一个基于Flutter框架的二手物品交易平台项目。这个项目最吸引我的地方在于它完美结合了Flutter的跨平台优势与HarmonyOS的生态特性,实现了"…

2026/10/14 0:00:41 阅读更多 →
DFS算法解决飞机降落调度问题实战

DFS算法解决飞机降落调度问题实战

1. 项目背景与核心思路飞机降落问题是一个经典的调度优化场景,也是算法竞赛和面试中的高频题目。这个题目要求我们合理安排多架飞机的降落顺序和时间,确保所有飞机都能安全着陆而不发生冲突。在实际航空管制中,这类问题直接关系到飞行安全和机…

2026/10/14 0:00:41 阅读更多 →

周新闻

流感时间序列预测实战:ARIMA/LSTM全流程拆解与避坑指南

流感时间序列预测实战:ARIMA/LSTM全流程拆解与避坑指南

简介:基于 ARIMA、LSTM、Transformer 等模型的流感时间序列预测 Python 源码,面向计算机相关专业课程设计与期末大作业学生,以及项目实战学习者。内容覆盖预处理、平稳性检验、定阶、残差分析、多模型对比预测的完整时序建模流程,…

2026/10/14 3:30:28 阅读更多 →
影刀RPA新手教程:键盘模拟输入实战——输入文本与模拟按键的区别

影刀RPA新手教程:键盘模拟输入实战——输入文本与模拟按键的区别

影刀RPA新手教程:键盘模拟输入实战——输入文本与模拟按键的区别 做影刀RPA自动化,十个新手有八个栽在"往输入框里填东西"这件事上:要么填不进去,要么填了一半,要么直接把原来内容追加在后面。这背后的根因&…

2026/10/14 16:30:29 阅读更多 →
影刀RPA新手教程:阅文起点小说数据采集实战——书籍信息与章节内容

影刀RPA新手教程:阅文起点小说数据采集实战——书籍信息与章节内容

影刀RPA新手教程:阅文起点小说数据采集实战——书籍信息与章节内容 1. 认识影刀:什么场景该用RPA采小说数据 起点中文网的页面结构相对稳定——分类榜单、书籍详情、章节内容三块独立页面,跳转链路清晰。这种场景非常适合影刀自动化&#x…

2026/10/14 3:29:58 阅读更多 →

月新闻

我发现了一个新思路:用 Remotion + Claude Code 像写代码一样自动化生成短视频

我发现了一个新思路:用 Remotion + Claude Code 像写代码一样自动化生成短视频

/* MD / 富文本中的 .toc(含博客园搬家等嵌套结构);.toc-box 在侧栏,不受影响 */#content_views .toc,/* 编辑器常在目录前后插入空 p(:empty 仍占 20px),一并去掉避免顶空隙 */#content_views.markdown_views > p:empty:has(+ .toc),#content_views.markdown_views …

2026/10/13 22:01:27 阅读更多 →
Windows下 Codex 中 Chrome 和 Computer Use 插件不可用问题排查及解决参考方式:TaoToken 统一 Key 配置与验证

Windows下 Codex 中 Chrome 和 Computer Use 插件不可用问题排查及解决参考方式:TaoToken 统一 Key 配置与验证

/* MD / 富文本中的 .toc(含博客园搬家等嵌套结构);.toc-box 在侧栏,不受影响 */#content_views .toc,/* 编辑器常在目录前后插入空 p(:empty 仍占 20px),一并去掉避免顶空隙 */#content_views.markdown_views > p:empty:has(+ .toc),#content_views.markdown_views …

2026/10/13 14:57:39 阅读更多 →
黑夜航拍船只数据集训练YOLOV5模型全流程解析

黑夜航拍船只数据集训练YOLOV5模型全流程解析

/* MD / 富文本中的 .toc(含博客园搬家等嵌套结构);.toc-box 在侧栏,不受影响 */#content_views .toc,/* 编辑器常在目录前后插入空 p(:empty 仍占 20px),一并去掉避免顶空隙 */#content_views.markdown_views > p:empty:has(+ .toc),#content_views.markdown_views …

2026/10/14 7:53:34 阅读更多 →