Github域名加上1s，在線VS Code閱讀源碼神器誕生

近日，一款域名為 github1s 開(kāi)源項(xiàng)目誕生了，正如他的名字所說(shuō)，只要在 github 地址上面加上 1s，就能秒級(jí)用在線 VS Code 打開(kāi) github 項(xiàng)目，這可以說(shuō)為開(kāi)發(fā)者帶來(lái)了巨大的便利?。?！

我們來(lái)看看這個(gè)項(xiàng)目打開(kāi)后長(zhǎng)什么樣子~

以大家廣為知道的 React 為例，只要將 github 替換成github1s

http://github.com/facebook/react

http://github1s.com/facebook/react

然后我們來(lái)談?wù)勥@個(gè)項(xiàng)目的優(yōu)缺點(diǎn)

優(yōu)點(diǎn)

幾乎擁有和本地 VS Code 一樣的界面

在在線 VS Code 中打開(kāi)，同樣的款式同樣的配方，這樣閱讀起來(lái)非常有親切感，這種親切感，可以更好地提高我們閱讀代碼的效率。

支持 VS Code 中的部分快捷鍵

能夠 command + 單擊 （window 應(yīng)該是 ctrl + 單擊）自動(dòng)跳轉(zhuǎn)到對(duì)應(yīng)的函數(shù)。

支持 hover 后能夠推導(dǎo)類型

支持代碼收起和展開(kāi)

這個(gè)功能對(duì)閱讀源碼非常有幫助，可以幫助我們收起一些不重要的函數(shù)，讓我們摸清代碼的主干。

支持代碼在線比較

選中兩個(gè)文件右鍵，就可以進(jìn)行在線比較

一鍵下載單文件

對(duì)于 Github 站點(diǎn)上閱讀整體目錄不便的情況下，并且下載文件總是需要點(diǎn)擊 Raw 再下載源文件，可以說(shuō)這個(gè)功能方便太多了。（當(dāng)然你也可以下載一些其他的插件）

缺點(diǎn)

不能點(diǎn)擊文件跳轉(zhuǎn)至其他文件

目前的版本中是無(wú)法直接點(diǎn)擊引用文件自動(dòng)打開(kāi)其他文件

無(wú)法全局搜索

只有當(dāng)我們打開(kāi)了當(dāng)前的文件，才會(huì)從當(dāng)前打開(kāi)的頁(yè)面中進(jìn)行全局搜索，沒(méi)有打開(kāi)的頁(yè)面沒(méi)辦法全局搜索，這樣對(duì)大型庫(kù)的源碼閱讀還是造成了一定的影響。

技術(shù)探索

在 api 層面看到主要還是走了 github 的開(kāi)放接口，這樣有個(gè)問(wèn)題就是我們國(guó)內(nèi)用戶，訪問(wèn)起來(lái)還是沒(méi)法達(dá)到1s那么快，但是我的網(wǎng)絡(luò)基本上3s初次渲染也完成了。

總結(jié)

帶來(lái)了一定的便利，比純用 github好用多了，也比 sourcegraph  插件使用起來(lái)體驗(yàn)更好！但是想要完全替代本地編輯器閱讀源碼，任然需要完善，例如上述說(shuō)到的缺點(diǎn)。

綜上源碼閱讀體驗(yàn)排名:

本地VS Code > Github1s > sourcegraph > Github站點(diǎn)。

如果還有什么我沒(méi)有發(fā)現(xiàn)的優(yōu)缺點(diǎn)，歡迎留言中指出~

1. CSS變量對(duì)JS交互組件開(kāi)發(fā)帶來(lái)的提升與變革
   

2. Vue scoped與深度選擇器deep的原理

3. 如何做到在 Markdown 中使用 Vue 語(yǔ)法
   

4. 【深入vue】為什么Vue3.0不再使用defineProperty實(shí)現(xiàn)數(shù)據(jù)監(jiān)聽(tīng)？

5. 帶你五步學(xué)會(huì)Vue SSR

6. Vue3 新增API

7. Vue Router history模式的配置方法及其原理