History in Threads: 火狐插件实现浏览历史按主题显示(树)

简介: 用JavaScript实现的火狐插件, 代码中使用中文命名. 实现浏览历史按主题以树的形式显示. Firefox addon implemented in JavaScript, with Chinese naming, to show browsing history in threads.

History in Threads似乎是唯一一个业余项目里有确认用户的. 大部分JavaScript源码(300+行)也用了中文命名.

插件功能很简单, 就是根据网页点击顺序生成树, 每个树可以认为是主题相关的. 比如, 从一个B搜索页A点开了其中一个页面B, 显示搜索结果时B就是A的子节点(如下图的"proglog nlp - 国内版 Bing"). 火狐浏览器对页面点击顺序的保存维护好像比Chrome好一些. 生成的树比较完整(相比Chrome版).

最新版的界面很简陋(图源自源码库program-in-chinese/HistoryInThreads_WebExtension):
2018_01_15_hit_

这个"新版"是由于火狐浏览器旧API失效被逼出来的(port to WebExtensions · Issue #6 · nobodxbodon/HistoryInThreads). 顺便在主要算法部分改用了中文命名:

  • 访问缓冲表.js: 主要数据结构
  • utils.js: 所有不依赖于浏览器API的方法, 包括树的生成, 搜索时间处理, 根据关键词高亮历史记录等等
  • history.js: 根据关键词获取所有可能相关的浏览历史. 由于新版火狐API除去了根据多个URL获取历史记录的功能(优化运行速度 · Issue #1 · program-in-chinese/HistoryInThreads_WebExtension), 只好搜索两次, 一次按照(搜索关键词+历史时间)搜索, 一次只按照历史时间搜索(多搜了很多, 只好用上面的缓冲表避免每次搜索时都搜几万项历史记录). 相关的部分代码如下:
var 按关键词搜索历史 = function(关键词, 历史时间范围) {
    计时("调用前")
    带关键词访问记录 = [];
    未处理url数 = 0;

    if (关键词 != null) {
      当前关键词 = 关键词;
    }

    if (当前时间范围 == null || !不需重新索引(历史时间范围, 当前时间范围)) {
      无关键词访问记录 = [];
      访问细节表 = {};

      var 新回溯时间 = 取历史回溯时间(历史时间范围);
      历史回溯时间 = 新回溯时间;
      当前时间范围 = 历史时间范围;

      // TODO: 如果先按关键词搜索, 如果没有匹配, 可以省去搜索所有历史
      // 首先搜索所有浏览历史
      var 无关键词搜索选项 = 生成搜索选项('', 历史回溯时间);
    
      var 无关键词搜索 = browser.history.search(无关键词搜索选项);
      无关键词搜索.then(遍历无关键词历史记录);
    } else {
      var 带关键词搜索选项 = 生成搜索选项(当前关键词, 历史回溯时间);
      var 带关键词搜索 = browser.history.search(带关键词搜索选项);
      带关键词搜索.then(遍历带关键词历史记录);
    }

};

最近疏于插件开发. 如有兴趣参与, 欢迎联系.

2018-01-15

相关文章
uniapp input框监听回车搜索事件效果demo(整理)
uniapp input框监听回车搜索事件效果demo(整理)
|
6月前
|
移动开发 API UED
使用history.pushState管理浏览历史
使用history.pushState管理浏览历史
|
8月前
|
JavaScript API
history 模式刷新 404 问题解决方法
在使用 Vue Router 的 history 模式时,刷新页面可能会导致出现 404 错误。这是因为 history 模式依赖于浏览器的 history.pushState API 来管理路由状态,而刷新页面时浏览器会向服务器发送请求,服务器无法正确地解析这些路由并返回对应的页面,从而导致 404 错误。
700 0
【VsCode】1.70.0 新版本好用功能分享 :代码函数名称浏览时固定(功能原称 sticky Scroll)
在Code 1.70.0 以后,新增功能:sticky Scroll 。 效果描述: 在浏览长函数的时候,可以将函数的名称定义部分固定在顶栏,类似冻结窗口,方便查看函数功能,不必再跳转。
544 0
|
JavaScript
vue再读48-表格案例-搜索按钮实现功能
vue再读48-表格案例-搜索按钮实现功能
200 0
vue再读48-表格案例-搜索按钮实现功能
|
前端开发 JavaScript
制作四个选项卡页 Tab,用户可以通过切换不同的 Tab 页查看不同类别的新闻信息,每个 Tab 有对应的内容版块,点击某个选项卡时,显示对应的内容版块,隐藏其他内容版块,并且为了突出当前的选项卡,还
制作四个选项卡页 Tab,用户可以通过切换不同的 Tab 页查看不同类别的新闻信息,每个 Tab 有对应的内容版块,点击某个选项卡时,显示对应的内容版块,隐藏其他内容版块,并且为了突出当前的选项卡,还
286 0
制作四个选项卡页 Tab,用户可以通过切换不同的 Tab 页查看不同类别的新闻信息,每个 Tab 有对应的内容版块,点击某个选项卡时,显示对应的内容版块,隐藏其他内容版块,并且为了突出当前的选项卡,还
|
JavaScript Linux PHP
sublime window 配置记录 (转)
大家好,今天给大家分享一款编辑器:sublime text2    我用过很多编辑器,EditPlus、EmEditor、Notepad++、Notepad2、UltraEdit、Editra、Vim,还有包括netbeans , zendstudio, dreamweaver 等。
1198 0
|
缓存 JavaScript 前端开发
vue项目中keep-alive的使用,从详情页返回列表时保存浏览位置
针对以上前三点,页面的缓存,我们需要用到vue的内置组件keep-alive,来缓存列表页面,同时配合路由选项来更改页面的数据。
10498 0