Programming news, cool libraries, and productivity tips by Dev Awesome.

// Dev Awesome #17

August 29, 2019

Dev Awesome

Welcome to Dev Awesome, the newsletter for awesome developers. This week we have another dose of interesting articles, tools and inspiration to supercharge your afternoon. Enjoy!

Articles & Tutorials

The Cost of JavaScript - Great talk on JS performance and how to improve it

Addy Osmani goes over what makes JavaScript the most expensive web resource and shares some tips on how to make sites load quicker.

youtube.com

From jQuery to Vanilla JS: a Cheat Sheet

Reference guide for some of the most common jQuery patterns and their equivalents in plain JavaScript.

tobiasahlin.com

What's new in PHP 7.4

The new release is scheduled for November 2019 and it comes packed with cool features like arrow functions and the array spread operator.

stitcher.io

Beyond cookies: Today's options for client-side data storage

Nice comparison between cookies, the Web Storage API, IndexedDB, and other browser storage solutions.

blog.logrocket.com

Making Instagram.com Faster

A series of blog posts detailing how the Instagram web team managed to reduce the feed page loading time by 50%.

instagram-engineering.com

Libraries & Tools

Lottie - Render After Effects animations with React Native

A library by the Airbnb team that exports Adobe After Effects animations as json, parses them, and renders them natively on mobile!

airbnb.io

Marked - A markdown parser and compiler

Powerful, fast, lightweight markdown compiler. Available in the browser, Node.js, and as a CLI.

github.com/markedjs/marked

Humanize Duration - Turn milliseconds to readable time

JS library that translates milliseconds to human friendly strings. It has lots of customization options, including support for several languages.

github.com/EvanHahn/HumanizeDuration.js

Hackathon Starter - Boilerplate for Node.js web apps

Everything you need to kickstart a new node.js project in one repo. Includes working setups for OAuth, Sass, APIs, and much more.

github.com/sahat/hackathon-starter

Introducing the New React DevTools

The new major release for the React DevTools extension comes with better performance, improved interface, and many other cool changes.

reactjs.org

Inspiration & Design

Image Trail Effects by Codrops

A set of stunning effects for mouse-following image trails that show a random series of images.

tympanus.net

UI Faces - Aggregator for avatars that you can use in your design mockups

All photos are royalty-free and and tagged with age, gender, emotion and hair color for easy filtration and sorting.

uifaces.co

The birth of Inter: How the new GitHub font came to be

Excellent interview with Rasmus Andersson, the creator of the exciting Inter typeface, used by companies like GitHub and Mozilla.

figma.com

CSS-only directionally aware buttons

Great on-hover effect that animates buttons differently depending on the side the cursor came from.

codepen.io

Falling Dots - Pretty loading indicator

Interesting infinite loader with smooth animations and simple HTML and CSS.

codepen.io