BetterFE 前端技術週刊 - 2019/03/04

## 深閱讀

利用D3和quadtrees實現可視化交互中的鼠標拖拽選擇

推薦理由：在數據可視化交互中，利用鼠標點擊劃選拖拽，是咱們最經常使用的交互之一了，咱們稱之爲 brushing。這篇文章介紹瞭如何在散點圖中利用d3和d3-quadtree來實現這樣的交互，除了應用，還介紹了一些D3的優化知識，很是值得一讀。

「從源碼中學習」Vue源碼中的JS騷操做

推薦理由：vue咱們很熟悉，可是對源碼的瞭解可能還不夠，這裏總結了不少vue源碼中js的使用技巧和方式，讓咱們也能運用於實際開發，也能同時對vue源碼加深理解。

Reducer organization — taking a step further

推薦理由：傳統的reducer的switch方式在上下文和不當即return和添加default上會有一些不可控的缺陷，這使得swtich方式並非很是高效。而經過鍵值對的方式對象中選擇reducer，經過類和裝飾器建立reducer使其更有重用性、漂亮和整潔。

## 新鮮貨

現代瀏覽器的輕量級音頻庫

推薦理由：默認使用Web Audio API ，有不少新特性，涉及到音頻的業務需求能夠引入，功能強大，而且性能不錯，可以幫助你快速簡單全面的控制音頻 。

前端JS實現字符串/圖片/excel文件下載

推薦理由：在web開發中，若是你想讓用戶下載或者導出一個文件，應該怎麼作呢？本文將會爲你提供幾種下載方式以供參考，但願對你有所幫助

使用document.scrollingElement控制窗體滾動高度

推薦理由：要實現一個返回頂部效果，咱們目前的作法是下面兩個語句並行：document.documentElement.scrollTop = 0; document.body.scrollTop = 0; 就顯得很囉嗦，正是因爲這種現狀，document.scrollingElement這個屬性才應運而生，直接動態識別滾動容器。

## 視野 && 工具

獨家！支付寶首次披露其小程序技術架構

推薦理由：支付寶小程序的技術架構簡介，主要從系統架構、性能體驗、開發者工具、多端等方面進行介紹。在小程序大行其道的今天，瞭解它的架構方案和開發特色對開發者來講是必不可少的一門功課。

Chrome 調試技巧

推薦理由：chrome應該是web端的開發和調試最熟悉的工具了。這篇文章對經常使用的chrome瀏覽器調試命令和部分面板作了介紹，不算最全面，可是很是精細實用。