Web Development Reading List: Announcing Changes, A Design Kit, DNA Malware, And Why Meaning Is An Advantage

You might have noticed it already: in the past few weeks you might have missed Anselm’s Web Development Reading List¹ issues here on SmashingMag. No worries, from now on, we’ll switch to collecting the most important news of each month in one handy, monthly summary for you. If you’d like to continue reading Anselm’s weekly reading list (and we encourage you to!), you can still do so via email², on wdrl.info³ or via RSS⁴. — Editorial Team

Hello again! I’ll continue publishing this resource and am grateful for everyone who supports my ongoing work. And to celebrate the last weekly edition, I found a lot of great articles for you: Biohacking news that sound like science fiction, advances in deep learning with JavaScript, and a lot more. Happy reading!

News Link

• The upcoming Chrome 61⁵ (in beta channel now) brings support for JavaScript modules, the Payment Request API on desktop, smooth-scrolling in CSS, 8-digit hex colors (with alpha transparency), and the new Expect-CT HTTP header.
• Edward Thomson shares why you should upgrade your git installation⁶ to 2.14.1 to fix vulnerabilities.
• Microsoft will change their Edge rendering engine⁷, making it independent of and asynchronous to the main thread.
• This week, Opera announced the end of Opera Max⁸, their data-saving browser product. The service will still stay active for a while but probably not for too long.

UI/UX Link

• The Facebook design team shares a Sketch template full of design elements found in macOS⁹. And if you’re looking for iOS GUI resources, they’ve got you covered¹⁰, too.

¹¹

Tooling Link

• Puppeteer¹⁴ is a Node.js library that provides an API to control headless Chrome. It can also be configured to use full (non-headless) Chrome.

Security Link

• Biohackers found a way to encode malware into a strand of DNA¹⁵ so that the gene sequencer will get infected once it analyzes the DNA.
• Pavel Durov shares why they chose not to use end-to-end encryption by default at Telegram¹⁶. An interesting point of view that gives more insights into why Telegram is different from other messengers.

Web Performance Link

• Andreya Grzegorzewski explains how we can use the Cache API for offline POST requests¹⁷ in Progressive Web Apps. This super cool trick allows us to queue POST requests, such as a form submission/data upload, cache it, and send it to the server once the user is back online.

HTML & SVG Link

• If you want to use <details>/<summary> elements together with rem font-size values on your site, be aware that there’s a bug in Safari that renders parts of a website with that CSS combination useless. After tracking it down and debugging it, I finally summarized the case¹⁸.

Accessibility Link

• Eva Ferreira shares ten guidelines to improve your web accessibility¹⁹ — from reliance on colors to proper markup and other tips.

²⁰

JavaScript Link

• deeplearn.js²³ is a hardware-accelerated machine intelligence library for the web. You can use it to build and train neural networks in your browser, to play color sequences or detect objects in images, for example.
• flatpickr²⁴ is a dependency-free, lightweight and powerful datetime picker.
• Peter Kröner shares how he achieved immutable arrays and objects in JavaScript in only 33 lines²⁵ (German article, automatically translated) without any library with ECMAScript Proxies.

CSS Link

• This nice Codepen experiment by Giana shows that you can create beautiful directionally-aware hover effects only with CSS²⁶.

²⁷

Work & Life Link

• Christian Heilmann wrote about why he wants to take a break and change his work life²⁹ to be more productive and focus on coaching others. A good read.

Going Beyond… Link

• John Battelle compares our addiction to social media with tobacco³⁰. This is not how we want to raise our children.
• Darius Foroux on why you should spend less time in your head³¹, thinking, worrying, stressing, but exercise pragmatism instead. An article about mastering your mind and realizing that most of our thoughts cannot make it into practice.
• Bernadette Jiwa shares her thoughts on why meaning is a competitive advantage³² and why we are fortunate that we can pursue our passion in our work.

—Anselm

Footnotes Link

1. 1 https://www.smashingmagazine.com/tag/web-development-reading-list/
2. 2 https://wdrl.info/
3. 3 https://wdrl.info/
4. 4 https://wdrl.info/feed
5. 5 https://blog.chromium.org/2017/08/chrome-61-beta-javascript-modules.html
6. 6 https://www.edwardthomson.com/blog/upgrading_git_for_cve2017_1000117.html
7. 7 https://blogs.windows.com/msedgedev/2017/08/17/making-web-smoother-independent-rendering/
8. 8 http://blogs.opera.com/mobile/2017/08/upcoming-changes-opera-max/
9. 9 http://facebook.design/desktopkit
10. 10 http://facebook.design/ios10
11. 11 http://facebook.design/desktopkit
12. 12 http://facebook.design/desktopkit
13. 13 http://facebook.design/desktopkit
14. 14 https://github.com/GoogleChrome/puppeteer
15. 15 https://www.wired.com/story/malware-dna-hack
16. 16 http://telegra.ph/Why-Isnt-Telegram-End-to-End-Encrypted-by-Default-08-14
17. 17 https://medium.com/web-on-the-edge/offline-posts-with-progressive-web-apps-fc2dc4ad895
18. 18 https://colloq.io/blog/safaris-detailssummary-rem-font-size-issue
19. 19 https://aerolab.co/blog/web-accessibility/
20. 20 https://aerolab.co/blog/web-accessibility/
21. 21 https://aerolab.co/blog/web-accessibility/
22. 22 https://aerolab.co/blog/web-accessibility/
23. 23 https://pair-code.github.io/deeplearnjs/
24. 24 https://chmln.github.io/flatpickr/
25. 25 http://www.microsofttranslator.com/bv.aspx?from=&to=en&a=http%3A%2F%2Fwww.peterkroener.de%2Fimmutable-arrays-und-objekte-fuer-javascript-mit-proxies%2F
26. 26 https://codepen.io/giana/pen/YZWjQy
27. 27 https://codepen.io/giana/pen/YZWjQy
28. 28 https://codepen.io/giana/pen/YZWjQy
29. 29 https://christianheilmann.com/2017/08/16/taking-a-break-and-so-should-you/
30. 30 https://shift.newco.co/is-social-media-the-new-tobacco-936d28a2bfe2
31. 31 https://getpocket.com/explore/item/stop-spending-so-much-time-in-your-head-1381441550
32. 32 http://thestoryoftelling.com/meaning-advantage/

↑ Back to topTweet itShare on Facebook