最近flutter很火。抽空看了一下dart的语法。 dart是一个既支持jit又支持aot编译的语言。 但书里也没写如何aot编译为二进制文件。 dart大部分语法对于typescript使用者来说无门槛。只要import就全部变量直接可用这点，对于es的显式import有些不习惯，不过有language sever的ide支持，补全功能与ts一样好用。 async/await与前端开发一摸一样，promise换成了future。

以下是我部门的面试指导，我觉得很好 也作为我以后评价别人对我面试的一个判断标准 面试的目的不是考倒对方！而是让候选人展示他的知识，能力，和性格。 判定标准：你希望这个人以后和你一起工作吗？ 把候选人当成你的同事 向候选人学习 除了技术角度，需要从以下几点考察： 理解力： 你说的新事情需要候选人理解 沟通：能主动回问问题 独立思考：遇到一件事情能知道怎么办 执行力：工作是如何快速推进的 再加上我的一些补充 问一问最近在学习什么，列举一些对自己提升很大的书籍。 读过哪些开源的代码及理解。 每年或每个项目过后，自身的成长。

最近从阮一峰的分享中看到了一篇文章 请不要用 JSON 作为配置文件 其中的一些观点 json的设计目标只是轻量级数据交换语言。 json的通用解析不能解析注释。 到底应该用哪种格式作为配置文件？没有确定的答案，这依赖与项目的应用场景，语言，工程等多方因素。 命令行flag是一个相对通用的选择。 我在一些工具类项目中也深有体会，其中最令人不快的大概要算是tsconfig.json文件了。 在我开发过得一些前端工具项目中，基本使用js文件作为配置文件。原因如下 本身就是前端项目，可以直接require配置文件。 js配置文件中可以添加任何需要的逻辑，例如根据不同的环境变量输出不同的配置。例如eslint与babel都支持js格式的配置文件。 如果考虑到该配置文件需要跨语言支持，可以考虑yaml。 虽然typescript只支持tsconfig.json，但其验证功能却很有用。 假设用deno识别ts文件作为配置文件，在ts文件中引入对应项目的配置文件类型可自动校验配置。 如果需要识别多种格式的配置文件，不要自己挨个写类型识别。 推荐一下通用配置文件识别工具。 cosmiconfig

一直用各种测试库都会遇到一种问题，当一些抽象的功能函数throw error的时候， 错误会提示到该函数内，而不是调用函数的地方。 但各种测试库的断言函数就不会有这种问题，会直接提示到调用行。 最近想起了这个问题，查了一下发现了Error.captureStackTrace这个方法。 是v8引擎自带，并不是es标准语法，见文档。 例子看了看，半明白，自己实验一下才知道具体使用场景。 应该是配合自定义的Error类来用的。 Error.captureStackTrace的第二个参数就应该放需要被忽略的断言函数或想要被忽略的自定义函数。 assert库里的fail方法，就是该功能的一个兼容封装，可以直接使用。

原生方法 navigator.mediaDevices.getDisplayMedia()，chrome版本要求高，刚出一个月左右，大概72版本才可用。 缺点：截图的时候会一定会出提示，选择需要截图的屏幕、应用、或chrome的tab。用户体验不太好。 chrome extension，方法 需要开发一个额外的扩展，截图api调用chrome.tabs.captureVisibleTab， 缺点：只能截图当前页面的可见部分。额外安装扩展。 html2canvas第三方库 调研了一下该库的基础截图原理，希望找到可用的底层api，但发现该库用的是最艰难的方法，将dom在绘制时获取computed style一层层绘制。 缺点：会出现截图和实际页面不太一致的情况。 优点：兼容性好，不需要客户额外安装。

当flex布局时，可以在父元素用justify-content调整子元素主轴位置。 有一种情况，需要大部分元素左对齐，只有最后一个右对齐。 子元素只有align-self可以调整辅轴的自身位置，主轴位置只能靠父元素设置。 float没用，可以用position: absolute调整但效果不理想。 https://www.w3.org/TR/css-flexbox-1/#auto-margins 利用margin的auto竟然可以达到这种效果。

2018前端总结 新技能 chrome extension puppeteer/puppeteer-core mobx/mobx-utils typescript/tslint koa2 mobx commitlint changelog git-cz fetch-mock markdownlint ant-design service worker/pwa 老技能强化 jest webpack react babel vim/nvim tslint/prettier git hooks domain driver development nginx

一个chrome扩展通常的执行顺序 其中的api繁多而且大多没有例子。 开发期间发现了这个 https://github.com/xpl/crx-hotreload 介绍文章 https://60devs.com/hot-reloading-for-chrome-extensions.html 对于扩展开发十分有用，有时候产生的错误比较多的时候扩展不能刷新，还是需要关闭浏览器重开才能生效。

nginx location匹配优先级 location blocks with the = modifier: If the specified string exactly matches the requested URI, Nginx retains the location block. 匹配使用=的严格相等的路径 location blocks with no modifier: If the specified string exactly matches the requested URI, Nginx retains the location block. 匹配严格相等的无匹配符号的路径，例如 location /abc {…}，请求正好为/abc location blocks with the ^~ modifier: If the specified string matches the beginning of the requested URI, Nginx retains the location block.