Links for 2019-07-25
The Simplest Way to Load CSS Asynchronously | Filament Group, Inc.
One of the most impactful things we can do to improve page performance and resilience is to load CSS in a way that does not delay page rendering. That’s because by default, browsers will load external CSS synchronously—halting all page rendering while the CSS is downloaded and parsed—both of which incur potential delays. Of course, at least a portion of a site’s CSS should be loaded before the page should be allowed to start rendering, and to get that initial CSS to the browser immediately, we recommend inlining (or HTTP2 server-pushing) the CSS. For sites with a small amount of overall, that alone might be enough, but if the CSS is large (say, bigger than 15 to 20kb), it can help performance to split it up by priority. Once split, less-critical CSS should be loaded in the background—AKA asynchronously. In this post, I aim to describe up our preferred way to do that these days, which has actually been around for years.
July 25th 2019
GitHub Open Source Collection of Animated Micro-Interactions
Cuberto . is a UI/UX and development studio based in San Francisco, CA. I might be a little late in the game but they have shared an inspiring and interesting collection of 'open source' of animated micro-interactions for your mobile app design. Trust me, these are great! It's a combination of transitions combining small animations but also more 'complexed' results where you will have many actions like 'dragging a value' with a flair, 'revising the UI shadow' merged with an intuitive interaction on 'tap'. I took the liberty to share them on ABDZ alongside with their direct link to the GitHub source file for your reference. Give it a look!
July 25th 2019