每月 Web 開發更新 8⁄2018：JavaScript、開源道德和 QUIC 的成本

構建技術和軟件已成為一項非常負責任的工作。 人們信任我們創造的產品，它們也可以對他們的生活產生重大影響。 考慮到這一點，我們不僅需要考慮包容性解決方案，還需要站出來倡導道德、可靠性和安全性。 這是一個賦予我們力量的職位。

Eric Meyer 發表了一篇文章，詳細闡述了純 HTTPS 網絡帶來的問題。 在其中，他揭示了發展中國家從這種發展中遭受了很多痛苦，因為他們經常有糟糕的互聯網連接，並且由於加密，他們現在遇到的網站錯誤比以前更多。 Ben Werdmuller 加入並發表了文章“停止為舊金山建設”，他在其中指出了我們作為開發人員面臨的最大問題之一：我們使用特權硬件和基礎設施。 我們使用最新的 iPhone、具有千兆位或快速 4G 連接的 Macbook 來構建體驗，但從不認為我們正在構建的大多數人使用的設備和基礎設施遠沒有那麼完善。 毫無疑問，讓網絡更加安全是一個好主意，但我們也應該牢記最新技術和我們的設計決策可能對其他人產生的影響。

消息

• TypeScript 3.0 發布了一些方便的語言功能和修復。
• 客戶端提示已經在 Chrome 中實施了很長時間，這是一個了不起的功能。 為了改善隱私，Chrome 67 更改了響應式圖像的客戶端提示功能。Colin Bendell 解釋了這些差異以及為什麼客戶端提示對性能如此有用。
• 開發人員一直在詢問 Safari 的智能跟踪預防 (ITP) 以及如何在啟用它的情況下調試網站。 現在 WebKit 團隊分享了 ITP 調試模式，它為您提供了更多的靈活性和工具來跟踪問題。
• 從 10 月開始，大多數瀏覽器將完全不信任賽門鐵克 TLS 證書，從而阻止訪問仍在使用它們的網站。 如果您還沒有，請更新您的證書。
• 最新版本的 Chrome (68) 在訪問 HTTP 頁面時帶來了新的“不安全”通知。 請注意這一點並相應地升級您的網站。 Chrome 68 中的另一個新功能是新的頁面生命週期 API，這是一個用於頁面事件的全新 API，以及 Payment Handler API。 現在，在向 service worker 請求更新時會忽略 HTTP 緩存，從而使 Chrome 與規範和其他瀏覽器保持一致。 除此之外， cursor值grab和grabbing現在在新版本中沒有前綴——終於。

一般的

• 如果你正在為開源構建，你需要決定你的項目應該使用哪個許可證。 現在有一個新選項，Just World 許可證。 它適用於“總體上同意開源軟件的原則，但對他們的軟件被用作破壞生命、我們的環境和我們的未來的努力的一部分感到不舒服”的開發人員。
• 如今，深度學習機器是一個大話題，但有些人正在探索更好的算法，這些算法在視頻遊戲中的表現很容易勝過深度學習機器。
• Drew DeVault 的“簡單、正確、快速：按此順序”很好地提醒您在網絡和軟件開發中直接設置優先級。
• Jonathan Fulton 寫了一個方便的資源，名為“我希望當我開始成為一名 Web 開發人員時我就知道的基本架構概念”，這是一個很棒的 Web 架構 101，也是我們行業新手的基礎。

用戶界面/用戶體驗

• Ethics for Design 是一個項目，來自八個歐洲城市的 12 名設計師和研究人員討論了設計對我們社會的有時是有害的影響，以及設計師可以做些什麼來造福所有人，而不僅僅是少數人。

工裝

• Prashant Palikhe 寫了一篇關於使用 Chrome 的開發者工具進行調試的藝術的長篇故事，我強烈推薦它，因為它是了解瀏覽器開發者工具的非常完整的參考資料。 如果您使用其他瀏覽器，這不是什麼大問題，因為大多數工具都非常相似。
• WebP 是一種圖像格式，具有一些不錯的功能，並且可能是除了常見的 JPEG/PNG 格式之外最著名的新格式之一。 然而，創建 WebP 圖像仍然是一個挑戰，因此 Jeremy Wagner 寫了一篇關於如何將圖像轉換為 WebP 的指南。
• Douglas Creager 引入了新的網絡錯誤日誌記錄，它允許您指示用戶代理收集將出現在服務器日誌中的相同信息集。
• 我們中的許多人都沉迷於 Slack 之類的通信工具。 Wildbit 的人決定關閉 Slack 一周——這對他們的工作方式產生了重大影響。 一個有趣的案例研究，關於我們如何傾向於對一個有用的工具感到太舒服，而不再像我們應該使用的那樣使用它。 不時地，重新調整我們的想法很重要。
• Dennis Reimann 發布了 UIEngine 的第一個穩定版本，這是一個用於 UI 驅動開發的工作台。

安全

• 新的 Observer 出現了：ReportingObserver API 讓您知道您的站點何時使用已棄用的 API 或遇到瀏覽器干預。 到目前為止，它在 Chrome 69 中可用。您可以輕鬆地使用它來將以前僅在控制台中可用的錯誤發送到您的後端或錯誤處理服務。

網絡性能

• 您還記得 QUIC（快速 UDP 互聯網連接）嗎？ 他們內部使用的由谷歌設計的協議，並且在更大範圍內使用得很好？ 雖然 IETF 目前正在將格式標準化到年底，但 Cloudflare 工程師現在分享他們的測試經驗。

• 當您擁有用戶生成的內容時，您通常不知道您是否只有一個元素或要輸出的元素列表。 在 Colloq，我們想做正確的語義，並構建了一個系統，允許我們在容器中只有一個元素時輸出一個p標籤，否則輸出一個帶有各種列表項的ol / ul列表。

可訪問性

• Dave Rupert 分享了 A11Y 營養卡，這是一個試圖消化和簡化組件創作時的可訪問性期望的項目。
• 跳過鏈接是相當常見的輔助功能。 Hampus Sethfors 現在寫了一篇關於為什麼許多鏈接仍然斷開以及如何正確修復它們的文章。

JavaScript

• 在推出 Progressive Web App 一年後，Pinterest 工程團隊的 Zack Argyle 回顧了過去。 重要的是要注意他們決定構建 PWA 的原因：“我們為低帶寬環境和有限數據計劃中的人們提供的移動 Web 體驗並不好”。 但對他們來說，結果令人驚訝。
• Philip Walton 引入了新的頁面生命週期 API，它可以幫助我們通過事件更輕鬆地確定瀏覽器中的頁面狀態，例如頁面在後台（不可見）、活動、凍結甚至終止。
• 哎呀，你們都知道 JavaScript 中的eval()不好，對吧？ 這就是為什麼我們通常禁止在內容安全策略中使用它。 但是 Remy Sharp 提醒我們，有一行代碼同樣不利於安全。
• Addy Osmani 在 2018 年研究了 JavaScript 的成本，現在分享證據表明 JavaScript 的每個字節仍然是我們可以發送到手機的最昂貴的資源，因為它會顯著延遲交互性。 這是一個問題，特別是對於在科技行業之外廣泛使用的功能不那麼強大的手機。
• Hidde de Vries 解釋了我們如何使頁面標題在 JavaScript 單頁應用程序中可訪問。

CSS

• Max Bock 探索了一些 CSS 網格技術，用相對簡單的代碼構建未來的佈局。
• Sara Soueidan 解釋了我們如何使用現代 HTML 和 CSS 構建包容性切換開關。
• Jen Simmons 分享了常見的 CSS 網格錯誤以及如何解決這些錯誤。
• Ethan Marcotte 解釋了我們主要用於 CSS 網格的仍然相對較新的fr單元。

工作生活

• 巴黎馬克思寫了為什麼他認為數字游牧民族不是未來。 他認為，只有通過公共資金建立的通信基礎設施才有可能實現位置獨立，濫用它們是不公平的。
• 本週，我了解到跳出框框思考是多麼有用，以及遠程工作和追求你的愛好如何幫助解決技術挑戰。
• 這不是公司第一次測試每週工作 4 天。 然而，很高興看到如何成功地建立這個概念並為員工和完成的工作帶來好處。

超越……

• 託拜厄斯·範·施耐德 (Tobias van Schneider) 寫了為什麼 Sagmeister-Walsh 工作室通過保持小規模而如此成功，以及為什麼夢想遠大但保持小規模對創造性思維如此重要。
• Ben Werdmuller 分享了他對例如在舊金山創業的不同看法。 這是一個故事，其中 117,000 美元在舊金山被認為是“低收入”，這如何限制了想法。
• Jeremy Nagel 讓我們思考我們的開源代碼的影響：作為開發人員，我們傾向於認為免費提供我們的代碼是一個了不起的舉措，但我們忘記了我們也將它提供給壞玩家——煤礦工人，污染貢獻公司，那些利用人們致富但虐待他們的人，那些間接敲詐你的人。 並不是說您對此無能為力； 您必須了解這些問題並應用更好的許可證或在您的代碼中添加專用語句。
• 印度有一個很大的塑料垃圾問題。 幾個月以來，一些漁民不再忽視塑料問題，而是將所有廢物收集在網中，並將其帶回用於修路的岸邊。 有效利用垃圾的好主意。