Podcasts Technology Syntax - Tasty Web Development Treats What's New in Javascript

What's New in Javascript

Published: May 16, 2018, 1 p.m.

Scott and West talk about what\u2019s new in JavaScript.

Fluent Conf - Sponsor

Developers, software engineers, designers, and web performance professionals flock to Fluent in pursuit of a common goal: building a better web. That means delivering fast, secure, accessible experiences to users and customers.

Fluent\xa0covers a broad range of technologies and topics to provide web programming professionals with the skills, connections, and inspiration needed to build better online and mobile experiences.

Fluent\xa0is this June 11-14 in San Jose, CA. Save 20% today with code:\xa0SYNTAX

Netlify \u2014 Sponsor

Netlify\xa0is the best way to deploy and host a front-end website. All the features developers need right out of the box: Global CDN, Continuous Deployment, one click HTTPS and more. Hit up\xa0netlify.com/syntax\xa0for more info.

They are also hiring!\xa0netlify.com/careers

Show Notes

1:55 - Scott\u2019s new studio

4:57 -\xa0Pop Motion Pose

  • New library for React or vanilla JavaScript
  • Define locations instead of CSS styles
  • Pass the animation state into a React component as open or closed instead of active or inactive
  • Flip animation techniques
  • Style Fire\xa0- Simple HTML & SVG styler optimised for animation

8:44 -\xa0Intersection Observer

  • Browser-based API based on observables
  • Example uses: Tell me when this element is on the page, goes off the page or is halfway down the page

10: 32 -\xa0MDX

  • Webpack loader for MDX (i.e. JSX-infused Markdown) using mdx-it
  • Turns MarkDown files into components in Webpack

12:56 -\xa0Resize Observer

  • Watch elements for resize

15:47\xa0Web Animations API

  • Works with animations natively in JavaScript
  • Tell your animations to play, pause, reverse, etc.
  • Instead of changing classes, you have full control over what the animation is doing
  • Web-Animation-JS Polyfill
  • Can I use

18:00 -\xa0Window Face Detector API

  • Create a new window.face detector and pass it an image tag and it returns an array of faces.

22:53 -\xa0Payment Request API

  • Eliminates check out forms
  • Allows platform to handle payment safely and securely

29:23 -\xa0INTL.NumberFormat

  • Format pricing with different currencies

32:59 -\xa0V8 BigInts

  • Makes working with big numbers more viable

34:53 -\xa0Speech Recognition

  • Converts speech to text
  • Pipe in different accents

36:22 -\xa0Text To Speech

  • Simulates text into spoken words

41:46 -\xa0ES6 Modules In Node

  • There are no ES6 modules in Node. It\u2019s still being developed. If you want to build an ES6 module in Node, you have to use the .mjs extension
\xd7\xd7\xd7 SIIIIICK \xd7\xd7\xd7 PIIIICKS \xd7\xd7\xd7 Tweet us your tasty treats!