The latest collection of news from JavaScript universe as of May 2017

Native ES modules at browsers

ES modules are starting to land in browsers! They're in…

  • Safari 10.1.
  • Chrome Canary 60 – behind the Experimental Web Platform flag in chrome:flags.
  • Firefox 54 – behind the dom.moduleScripts.enabled setting in about:config.
  • Edge 15 – behind the Experimental JavaScript Features setting in about:flags
      
        <script type="module">
          import {addTextToBody} from './utils.js';
          addTextToBody('Modules are pretty cool.');
        </script>
        // utils.js
        export function addTextToBody(text) {
          const div = document.createElement('div');
          div.textContent = text;
          document.body.appendChild(div);
        }
      
      
You need to know:
  • "Bare" import specifiers aren't currently supported
  • nomodule for backwards compatibility
  • Defer by default
  • Inline scripts are also deferred
  • Async works on external & inline modules
  • Modules only execute once
  • Always CORS
  • No credentials

Read more about it here.

Cool libs \m/

HR.js
  • plugin for highlighting and replacing text in the DOM
  • Zero-dependency
      
        new HR("#replace_highlight_example", {
          highlight:"elit",
          replaceWith: "boo",
          backgroundColor:"#B4FFEB"
        }).hr();
      
      

Read more about it here.

React VR
  • React VR is a framework for the creation of VR applications
  • pairs modern APIs like WebGL and WebVR
  • learn once, write anywhere

Read more about it here.

AcrossTabs
  • cross-origin communication among different browser tabs
  • Fully fledged API to get information regarding the tabs
  • Only ~4 KB gzipped
  • Parent → Child communication

Read more about it here.

Stylelint
  • modern CSS linter
  • Understands CSS-like syntaxes
  • Automatically fix some stylistic warnings
  • Used by Facebook, Github, Wikimedia, GSA, and WordPress among others

Read more about it here.

Sizzy
  • test responsiveness easily
  • has Chrome extension
Sizzy

Read more about it here.

k6
  • Like unit testing, for performance (load testing)
  • built with Go and JavaScript
      
      import { check } from "k6";
      import http from "k6/http";
      
      export default function() {
          let res = http.get("https://httpbin.org/");
          check(res, {
              "is status 200": (r) => r.status === 200
          });
      };
      
      
      
      $docker run -i loadimpact/k6 run --vus 10 --duration 30s -
      
      

Read more about it here.

Glimpse, new debugging tool

  • Full-stack Node.js web diagnostics
  • Information about both client and server-side requests
  • experiment by Microsoft
 

Magic happens here: 1. In your app`s root directory, use npm to install Glimpse. npm install @glimpse/glimpse --save-dev 2. Initialize Glimpse before any other

      
      require() or application logic (typically at the top of index.js or app.js).
      if (process.env.NODE_ENV !== 'production') {
          require('@glimpse/glimpse').init();
      }
      
      
3. Open your app in a browser. The Glimpse HUD should now be at the bottom right of your app.

Glimpse

Read more about it here.

Google I/O

  • Active monthly Android users surpass 2 billion
  • Google Assistant is now available on iOS
  • Android Go aims to connect the “next billion” users online
  • uses neural networks to train other neural networks
  • a shift from mobile-first to AI-first

Read more about it here.  

Polymer 2.0 landed

  • support for ES6 class-based syntax
  • lightweight core at just 11k
  • new Polymer Analyzer - a static analyzer for the web

Read more about it here.  

The Modern Mobile Web: State of the Union

  • Posted by Rahul Roy-chowdhury, VP Product Management, Chrome
  • 2,000,000,000 AMP pages have been created
  • Success stories:
    • Average page load time decreased from 12 seconds to less than one second, and conversion rates increased by 95% (Wego’s website)
    • engagement rates have more than doubled since launch (Forbes)
    • 20% of users who book using their PWA had previously uninstalled their app (Ola)

Read more about it here.  

Wowowowowow npm@5!

  • A new, standardised lockfile
  • --save is no longer necessary
  • npm no longer blasts your screen with the whole installed tree

Read more about it here.  

Carbon node.js v8.0

  • will become the current LTS version from October 2017 and will be maintained till December 31st, 2019
  • Say hello to the WHATWG URL parser
  • util.promisify()
  • started the process of assigning static error codes to all errors
  • have dropped the "v" in Node.js 8

Read More about it here.  

And few important things to remind from April'17 JavaScript news

React (v15.5.0)

  • New Deprecation Warnings
    • React.PropTypes and React.createClass
  • New packages
    • prop-type and create-react-class
  • Discontinuing support for React Addons. The add-ons have now all either been deprecated or moved to separate modules
  • Separating modules and reorganizing them
  • Who will have 0 warnings with 15.5, won’t have them with 16

Read more about it here.  

Bye-bye Phantom.js?

  • Vitaly Slobodin, the main maintainer dropped the project
  • greet headless Chrome (from v59)
  • Chrome asked maintainer to use Chromium as runtime target
  • PhantomJS creator Ariya Hidayat seems to have hopes for PhantomJS on Chromium
  • big challenge. As of this writing, PhantomJS has 1,801 open issues :)
  • and the main maintainer started Phantomium (PhantomJS API with Chrome)

Read more about it here.  

New MS Edge

  • Web developers can start testing EdgeHTML 15 today by downloading a free virtual machine from Microsoft Edge Dev
  • New tabs management, reading experience…
  • Microsoft Edge on the Creators Update uses 31% less power than Google Chrome 57, and 44% less power than Mozilla Firefox 52
  • For developers: Payment Request API, CSS Custom Properties, WebVR Developer Preview, WebRTC, async-await, TCP Fast Open, Intersection Observer, experimental support for WebAssembly…

Read more about it here.  

New Firefox (v53)

  • Quantum Compositor Process on Windows
  • Light and Dark Compact Themes
  • New WebExtension Features
  • New CSS Features: Positioned Masks and Flow-Root
  • A Better Default Media Experience
  • 64-bit Everywhere

Read more about it here.  

New Chrome (v58 and v59b)

  • IndexedDB 2.0 standard is now fully supported in Chrome
  • Progressive Web Apps become more immersive with display: fullscreen
  • goodbye to the clearfix, with display: flow-root
  • Headless Chromium
  • Native notifications on macOS

Read more about v58 here, and about v59b here.  

Browser’s market share

All platforms: Browser’s platform

Mobile:

  • in 2016 Opera shared that Opera Mini was Africa’s favorite browser, with an impressive 58% market share.
Mobile Browsers market share Browsers market share

Read more about it here.  

Facebook F8 takeaways

  • Facebook Messenger 2.0 (with Smart Replies)
  • Facebook Camera Becomes an AR Platform
  • Live Video and GIPHY
  • Facebook Spaces, the New VR Platform
  • Ultra-Connectivity (Terragraph and Aquila)
  • 360 Degree Camera
  • Silent Speech Recognition
    • ‘skin-hearing’ project and thoughts to text
  Facebook 360 Degree Camera

Read more about it here.

That's all JS news for now. Stay tuned to get new monthly JavaScript digests!