applications of my macbook pro

发表于 2017-07-10 更新于 2022-01-10 阅读次数： Disqus：

分享一下自己常用的几款在Mac上的软件，真的可以提高工作效率。

编辑器

sublime text
- 非常喜欢的一款简洁、轻量的编辑器，现在基本用来做临时的文本编辑等
intellij idea
- 日常写码利器、各种方便，用了便知道。这款软件使用了校园的企业邮箱账号可以申请到免费使用的license, 每次申请可使用期限为一年，第二年需要更新一次。
Visual Studio Code
- MS大大推出的神器，个人使用感觉是介于sublime与idea之前的一款编辑器，编写命令行操作频繁的简单demo时会用到。关键是免费。

阅读全文 »

在微信、QQ中进行二次分享小结

发表于 2017-06-19 更新于 2022-01-10 阅读次数： Disqus：

在近期工作中，又一次涉及到了微信、QQ这两大app中的分享问题。故将一些细小的点记录下来。

前期准备

首先，在微信的页面二次分享中你会用到jweixin.js的js-sdk，它是微信公众频道提供给开发者用于开发基于微信内的网页工具包。
其中对外暴露了许多有用的api，可以到这个文档中查看其引入、使用方式。
其次，对于手Q的二次分享中你会用到share.js,它提供了定制微信、手Q及QQ空间的分享内容定制的功能，其引用及使用方式可以参考文档给出的说明进行操作。

阅读全文 »

chrome headless探索

发表于 2017-06-09 更新于 2022-01-10 阅读次数： Disqus：

团队一直在支持视频提链的需求，近期利用chrome headless进行升级，效率大大提升。那么chrome headless是什么呢？

通过官方更新日志了解到，在chrome 59的版本加入了headless模式，所谓的headless就是一个无界面的浏览器，可以想有界面浏览器一样浏览网页，但无法直接看到页面。需要利用chrome远程调试接口进行调试。

那么，提供这样一个无界面的浏览器有什么用呢？官方给的答案是这样的

Why is that useful?

A headless browser is a great tool for automated testing and server environments where you don’t need a visible UI shell. For example, you may want to run some tests against a real web page, create a PDF of it, or just inspect how the browser renders an URL.

事实上，除了所描述的场景，还有更多的里有你会去使用他！

阅读全文 »

What's new in DevTools (chrome 59)

发表于 2017-06-07 更新于 2022-01-10 阅读次数： Disqus：

近期Chrome发布了59版本，那么与开发者最贴近的开发者工具中带来了什么新功能呢？

CSS&JS代码使用率检测

这个功能可以在Coverage Tab中展示使用到与未使用到的代码占比
全页面截图，传说中的超长截图。入口需要把模式切换成移动设备模式，更多 - Capture full size screenshot
阻止网络请求。手动的方式在网络面板阻止单个网络请求，方便进行页面的调试

单步调试async/await

function wait(ms) {
    return new Promise(r => setTimeout(r, ms)).then(() => "Yay");
}

// do some work in background.
setInterval(() => 42, 200);

async function test() {
    debugger;
    const hello = "world";
    const response = await fetch('index.html');
    const tmp = await wait(1000);
    console.log(tmp);
    return hello;
}

async function runTest() {
    let result = await test();
    console.log(result);
}