请选择 进入手机版 | 继续访问电脑版
Mozilla

火狐社区

登录    注册

用新浪微博连接 QQ互联

Fathom:一个能理解网页的框架语言

xuyuehang Mozilla员工 发表于 2017-5-5 17:40:51 | 显示全部楼层 [复制链接]
3 1376
本帖最后由 yingliu 于 2017-5-5 18:00 编辑

浏览器的作用是渲染网页,但人们完成一个简单的任务却需要经受“重重考验”:弹窗元素,不合理的文字排版,难以理解的各种自定义组件……为了提高用户的使用效率,我们需要一个更智能的浏览器。

想象一下,如果 Firefox 能像人类一样理解网页:

  • 浏览器可以识别登录链接并在后台跟踪完成操作,不需要跳转到其他页面。登录可以从页面上消失而变成一个浏览器标准 UI。
  • 商品可以被识别为可操作的滑块,你可以把它们拖到购物车,包括图片和价格,然后进行跨站购物,商品将变成可对比的列,而不再需要来回切换标签页来比价。
  • 解决低效和不一致的用户界面,我们可以通过浏览器提供的热键来去除弹窗元素,导航到下一个逻辑页面,标准化元素的界面外观,识别并展开不必要的页面分页。
  • 在小屏幕设备或窗口上,不使用响应式设计,页面也能隐藏多余的导航或标题部分。在没有打印样式表的情况下,浏览器也可以智能地分析要打印的内容。

这些可能的未来都假设在浏览器可以识别页面的有价值的部分。几十年来,人们已经做了很多尝试。 但微格式(microformats),语义标签,RDF 和链接/关联头这些还远远不够,因为网站的意义和他们所带来的额外操作不可分割。因此我们可以看到现代搜索引擎拥抱混乱来提取有价值的内容,浏览器的阅读器模式通过非语义标记直接隐藏页面的工具带。

但问题是:这些项目目的单一且制作成本很高。Readability 是 Safari 和 Firefox 阅读模式的基础,是由 1800 行 JavaScript 实现的,而这个项目最近被关闭。Chrome 的 DOM Distiller 是由 23,000 行 Java 写成。这些强制性的方法在 DOM 遍历和状态积累的机制中陷入僵局,忽略了“理解程序”的操作部分,所以难以实现。

但是如果理解程序的代码很容易呢? 如果 Readability 只需要四个简单规则就能实现呢?
  1. const rules = ruleset(
  2.     rule(dom('p,div,li,code,blockquote,pre,h1,h2,h3,h4,h5,h6'),
  3.          props(scoreByLength).type('paragraphish')),
  4.     rule(type('paragraphish'),
  5.          score(fnode => (1 - linkDensity(fnode,
  6.                                          fnode.noteFor('paragraphish')
  7.                                               .inlineLength))
  8.                         * 1.5)),
  9.     rule(dom('p'),
  10.          score(4.5).type('paragraphish')),
  11.     rule(type('paragraphish')
  12.             .bestCluster({splittingDistance: 3,
  13.                           differentDepthCost: 6.5,
  14.                           differentTagCost: 2,
  15.                           sameTagCost: 0.5,
  16.                           strideCost: 0}),
  17.          out('content').allThrough(domSort))
  18. );
复制代码
实现这一目标的框架是 Fathom,它显著降低了书写理解程序代码的成本,是一种用于编写语义提取器的迷你语言。构成其程序的规则集嵌入在 JavaScript 中,对诸如前进/返回按钮,地址表单和主要文本内容等部分进行识别,对 DOM 节点进行分类,并根据指定条件提取,同时还提供第三方扩展库。

fathom.jpg

Fathom 规则集是数据,看起来就像 JavaScript 函数调用,但调用只在一种语法树中进行注释,所以整个过程机器操作变得更加容易,也许将来有一天可以让它自动生成规则。

Fathom 是一种很年轻的语言,但已经应用在了 Firefox’s Activity Stream 中,它自动选择页面描述,主要图像等。相比众所周知的商业元数据解析服务,Fathom 仅用了 70 行代码就完成了操作。

如果你对这个项目有兴趣可以先从完整文档入手,获取 npm 补丁提交 patch,参与 irc.mozilla.org 上 fathom 的讨论,也可以订阅邮件列表,如开头所说,通过我们的努力构建一个更好的浏览器。

参考:https://hacks.mozilla.org/2017/0 ... standing-web-pages/
隐元 老狐狸
发表于 2017-5-5 20:19:30 | 显示全部楼层
mozilla不断尝鲜新潮先进的编程语言!
40℃半 社区新人
发表于 2017-5-10 19:42:28 | 显示全部楼层
改进并提高用户体验
310971373 狐狸精
发表于 2017-5-12 09:38:01 | 显示全部楼层
构建强大的语义网,从mozilla开始
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

发新帖
论坛更多 »
火狐微信
快速回复 返回顶部 返回列表