spaceninja + async   37

Async + Await in JavaScript
Flow Control in JavaScript is hard! Native Promises in JavaScript have helped immensely, but the syntax is still a little callback-y. With Async + Await, we can write synchronous looking code without losing any of the benefits of JavaScript's asynchronous nature. Wes Bos explores how async + await works, best practices for flow control, and explores several solutions for handling errors.
fridayfrontend  video  javascript  promises  async  await 
6 weeks ago by spaceninja
10 JavaScript Concepts You Need to Master React (+ Cheatsheet)
Aside from a few unique features that it has, such as JSX, React is at it’s core plain JavaScript. That means we can always use the best and most appropriate parts of JavaScript to enhance and better develop our React applications. In short, the better you become at JavaScript the better you’ll be at React.
fridayfrontend  javascript  react  let  const  literals  arrowfunctions  map  filter  reduce  arrays  destructuring  spread  ternary  promises  async  await 
10 weeks ago by spaceninja
Understanding Async Await
When writing code for the web, eventually you'll need to do some process that might take a few moments to complete. JavaScript can't really multitask, so we'll need a way to handle those long-running processes. Async/Await is a way to handle this type of time-based sequencing. It’s especially great for when you need to make some sort of network request and then work with the resulting data. Let's dig in!
fridayfrontend  javascript  async  await  promises 
11 weeks ago by spaceninja
Working with GraphQL using Vanilla JS
Let’s build a simple form that can communicate with a GraphQL API and search titles of books. We will only use HTML5, CSS3 and ES6 JavaScript.
javascript  es6  graphql  fetch  async  vanilla 
11 weeks ago by spaceninja
Adding Dynamic And Async Functionality To JAMstack Sites
Does that mean that JAMstack sites can’t handle dynamic interactions? Definitely not! JAMstack sites are great for creating highly dynamic, asynchronous interactions. With some small adjustments to how we think about our code, we can create fun, immersive interactions using only static assets!
fridayfrontend  jamstack  serverless  javascript  async 
12 weeks ago by spaceninja
Error handing when using the vanilla JS fetch() method with async and await | Go Make Things
Today, we’re going to look at how to handle errors when using the fetch() method with async and await.
javascript  fetch  async  await  catch  errors 
december 2019 by spaceninja
How to use async and await with vanilla JavaScript | Go Make Things
You may have seen async and await before and been confused about what they do or why you would use them. Today, I’m going to demystify things a bit with some practical examples.
javascript  vanilla  es6  async  await  promises 
december 2019 by spaceninja
Dealing with nested callbacks | Zell Liew
JavaScript is a strange language. Once in a while, you have to deal with a callback that’s in another callback that’s in yet another callback. People affectionately call this pattern the callback hell.
javascript  callbacks  promises  async  await 
december 2019 by spaceninja
JavaScript async and await in loops | Zell Liew
Basic async and await is simple. Things get a bit more complicated when you try to use await in loops. In this article, I want to share some gotchas to watch out for if you intend to use await in loops.
javascript  async  await  loops  for  foreach 
december 2019 by spaceninja
Deeply Understanding JavaScript Async and Await with Examples
Async functions have become really important. With the introduction of Async Iterators, async functions will see more adoption. It is important to have a good understanding of them for modern JavaScript developer. I hope this article sheds some light on that. :)
javascript  async  await  promises 
december 2019 by spaceninja
Handling Errors in JavaScript: The Definitive Guide
This article will be structured in 3 parts, first we will have a look at Errors in general. After that we will focus on the backend (Node.js + Express.js) and finally we’ll see how to deal with Errors in React.js. I chose those frameworks, because they are by far the most popular at the moment, but you should be able to apply your new found knowledge to other frameworks easily!
javascript  errors  node  express  react  try  catch  finally  async  tutorials  howto  projects 
december 2019 by spaceninja
Writing Asynchronous Tasks In Modern JavaScript
In this article, we are going to explore the evolution of JavaScript around asynchronous execution in the past era and how it changed the way we write and read code. We will start with the beginnings of web development, and go all the way to modern asynchronous pattern examples.
javascript  async  promises  await 
december 2019 by spaceninja
Get better at JavaScript with just JavaScript, by Wes Bos
This talk will be a mix bag of tips, techniques and code samples to improve your core JavaScript understanding and make you a more confident web developer. We will dive into the Modern Dom, data massaging techniques, flow control, async Javascript and some neat stuff in the future of JavaScript. Get ready to slam dunk JavaScript.
fridayfrontend  video  javascript  async  promises  destructuring  spread  rest 
december 2019 by spaceninja
There’s a special syntax to work with promises in a more comfortable fashion, called “async/await”. It’s surprisingly easy to understand and use.
programming  javascript  async  await 
october 2019 by spaceninja
Efficiently load third-party JavaScript
Avoid the common pitfalls of using third-party scripts to improve load times and user experience.
fridayfrontend  performance  javascript  async  defer  preconnect  lazyload 
september 2019 by spaceninja
The Simplest Way to Load CSS Asynchronously
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.
fridayfrontend  cssbasics  css  javascript  performance  async 
july 2019 by spaceninja
Showing Loading & Error States with Vue.js Async Components
Vue’s first-class support for asynchronous components is great, but not everyone is aware of how to show when an async component is loading or has failed to load. So let’s take a look at how to display error or loading components while we’re waiting for an asynchronous component to load.
javascript  vue  async  loading  error  components 
february 2019 by spaceninja
Vue.js REST API Consumption with Axios
Axios is a great http client library. It uses promises by default and runs on both the client and the server (which makes it appropriate for fetching data during server-side rendering). It’s also quite easy to use with Vue. Because it uses promises, you can combine it with async/await to get an amazingly concise and easy-to-use API, as I will demonstrate here.
javascript  vue  axios  ajax  rest  api  async  await 
february 2019 by spaceninja
New ES2018 Features Every JavaScript Developer Should Know
The ninth edition of the ECMAScript standard, officially known as ECMAScript 2018 (or ES2018 for short), was released in June 2018. Starting with ES2016, new versions of ECMAScript specifications are released yearly rather than every several years and add fewer features than major editions used to. The newest edition of the standard continues the yearly release cycle by adding four new RegExp features, rest/spread properties, asynchronous iteration, and Promise.prototype.finally. Additionally, ES2018 drops the syntax restriction of escape sequences from tagged templates.
fridayfrontend  css  cssbasics  javascript  es6  es2018  regex  rest  spread  async  finally  promises 
january 2019 by spaceninja
Promise chaining is dead. Long live async/await
​​Just because you use promises does not mean you’re tethered to the barbarity that is promise chaining. In this article, we will look at how async/await really makes developers’ lives easier and why you should stop using promise chaining.
javascript  async  promises 
november 2018 by spaceninja
The Evolution of Async JavaScript: From Callbacks, to Promises, to Async/Await
We’ve invented “patterns” for handling fetching external data for our apps. Like most things, these patterns each have tradeoffs that have changed over time. In this post we’ll break down the pros and cons of three of the most common patterns, Callbacks, Promises, and Async/Await and talk about their significance and progression from a historical context.
fridayfrontend  video  javascript  ajax  callbacks  promises  async  await  fetch 
november 2018 by spaceninja
How to fetch data in React
However, at some point you want to request real world data from an own or a third-party API. The article gives you a walkthrough on how to fetch data in React. There is no external state management solution, such as Redux or MobX, involved to store your fetched data. Instead you will use React’s local state management.
react  javascript  tutorials  ajax  fetch  async  await 
november 2018 by spaceninja
Why Using reduce() to Sequentially Resolve Promises Works
This is huge to understand because it probably goes against what you think is happening during this loop (at least, it did for me). When we use it to sequentially resolve promises, the reduce() loop isn't actually slowing down at all. It’s completely synchronous, doing its normal thing as fast as it can, just like always.
fridayfrontend  javascript  reduce  promises  async 
october 2018 by spaceninja
Promises and async/await cheatsheet
A handy cheatsheet to help make sense of promises and async/await.
cheatsheet  javascript  async  await  promises 
october 2018 by spaceninja
A Simple Guide to ES6 Promises
Promises are one of the most exciting additions to JavaScript ES6. For supporting asynchronous programming, JavaScript uses callbacks, among other things. However, callbacks suffer from problems like Callback Hell/Pyramid of Doom. Promises are a pattern that greatly simplifies asynchronous programming by making the code look synchronous and avoid problems associated with callbacks.
javascript  promises  async  callbacks  es6 
september 2018 by spaceninja
Live asynchronously
Last year I turned off all my notifications. I stopped booking meetings. I started living asynchronously. Now instead of being interrupted throughout the day — or rushing from one meeting to the next — I sit down and get work done. I work a lot. I communicate with hundreds of people a day. I collaborate extensively. But I do so on my own terms, at my own tempo.
work  culture  async  notifications  burnout  worklifebalance 
february 2018 by spaceninja
Async + Await, by Wes Bos
Flow Control in JavaScript is hard! Native Promises in JavaScript have helped immensely, but the syntax is still a little callback-y. With Async + Await, we can write synchronous looking code without losing any of the benefits of JavaScript's asynchronous nature.
fridayfrontend  video  async  await  javascript  es6  promises 
january 2018 by spaceninja
Modern Asynchronous CSS Loading
To load less-critical CSS files without blocking page rendering, we need to load them asynchronously.
fridayfrontend  css  async  blocking  critical 
december 2017 by spaceninja
async & await
JavaScript promises were a revelation in JavaScript, providing an alternative to the JavaScript callback hell we'd quickly found ourselves in.  Promises also allowed us to introduce and better handle asynchronous tasks.  While promises were an improvement over callback hell, they still require lots of thens which can become messy.  I've really taken to ES2017's async and await keywords for simplifying promise handling.  Let's have a look at async and await!
fridayfrontend  javascript  es2017  async  await  promises 
september 2017 by spaceninja
The Critical Request
Have you ever wondered how browser figures out which assets should be requested and in what order? Today we're going to take a look at how we can use resource priorities to improve the speed of delivery.
fridayfrontend  performance  html  css  priority  defer  async  critical 
august 2017 by spaceninja
CSS and the first meaningful paint
In this talk we will take a journey exploring the current, past, and future best-practices for loading CSS in the browser and how we can achieve a first meaningful paint within 1000ms. Ultimately creating a faster, more resilient experience for our users.
fridayfrontend  css  video  performance  critical  http2  defer  async 
june 2017 by spaceninja
Asynchronous vs Deferred JavaScript
Fortunately, the <script> element has two attributes, async and defer, that can give us more control over how and when external files are fetched and executed.
fridayfrontend  javascript  async  defer 
june 2017 by spaceninja
On Hurk-Jerk -
Mixed emotions on progressive critical path rendering
fridayfrontend  css  performance  critical  async 
august 2016 by spaceninja
Understanding Critical CSS – Smashing Magazine
Understanding Critical CSS: inline styles for "above-the-fold" content, async load the rest. by Dean Hume
fridayfrontend  css  critical  inline  async 
august 2016 by spaceninja
Load CSS or JS Files Simply & Asynchronously
Ever wonder about the simplest, fastest way to load a CSS file or a JavaScript file asynchronously? Well, we happen to think about these things a lot, and over the years we’ve been using and improving a couple of basic functions, which we call loadCSS and loadJS, that do just that. Here's how they work, in brief.
css  javascript  async  functions  performance 
august 2014 by spaceninja
Async Attribute and Scripts At The Bottom
Is there any reason to use the async attribute when the script is already at the bottom of the page?

Short answer: No
javascript  async  html 
august 2014 by spaceninja

Copy this bookmark: