JS digest, March 2017
16
JS digest March, 2017 by Oleksandr Oliynyk, Software Developer at ElifTech
Transcript of JS digest, March 2017
JS digest
March, 2017
by Oleksandr Oliynyk,Software Developer at ElifTech
www.eliftech.com
Agenda
New libs:▪ HyperApp: one more functional JS framework for FE▪ 15 Interesting JavaScript and CSS Libraries for March
2017▪ Nginx JavaScript is ready for prime time▪ Node.js Wrapper for YOLO/Darknet recognition
framework▪ Natural language detection▪ 2D JavaScript Physics Engine▪ javascript deep learning and reinforcement learning
library▪ Perceptual JPEG encoder▪ AR.js - Efficient Augmented Reality for the Web using
ARToolKit
New releases:▪ Angular 4▪ Next.js 2.0 is out
IDE news:▪ React JavaScript library gets an IDE▪ WebStorm 2017.1 released
Browser news:▪ Safari 10.1 out▪ Firefox 54 dev edition▪ Firefox 52
Misc:▪ The Future of Trust in Node.js Dependencies▪ Minecraft in WebVR with HTML Using A-Frame▪ Facebook tool cuts through React Native complexity
Some statistics:▪ 77% of sites use at least one vulnerable JavaScript
library▪ analysing the use of outdated JavaScript libraries on
the web▪ Front-End Tooling Trends for 2017
2
www.eliftech.com
HyperApp: one more functional JS framework for FE*
3
▪1kb JavaScript library for building frontend applications▪Declarative: HyperApp's
design is based on the Elm Architecture▪Stateless components:
Stateless components are framework agnostic, reusable and easier to debug▪Batteries-included: Out of the
box, HyperApp has Elm-like state management and a virtual DOM engine
import { h, app } from "hyperapp"
app({ model: 0, actions: { click: model => model + 1 }, subscriptions: [ (_, msg) => addEventListener("mousedown", msg.click) ], view: model => <h1 style={{ userSelect: "none" }} > {model} clicks </h1>,})
* https://github.com/hyperapp/hyperapp
www.eliftech.com
15 Interesting JavaScript and CSS Libraries for March 2017
4
▪3D web apps framework▪web gradients▪deep learning lib▪animations and more… check:
http://tutorialzine.com/2017/03/15-interesting-javascript-and-css-libraries-for-march-2017/
Nginx JavaScript is ready for prime time▪The company debuts Nginx Plus R12, the commercially supported version of its
technology. This release moves NginScript, a JavaScript-based programming tool, to general availability for production use. More at:
http://www.infoworld.com/article/3180404/javascript/nginx-javascript-is-ready-for-prime-time.html#tk.rss_javascript
www.eliftech.com
Node.js Wrapper for YOLO/Darknet recognition framework
5
▪Darknet is an open source neural network framework written in C and CUDA. This project wraps this framework in a Node.js native addon▪Currently, the wrapper implements a demo method to run a recognition from
the webcam/video or an image file▪Github: https://github.com/moovel/node-yolo
www.eliftech.com
Natural language detection (Franc)
6
What’s so cool about franc?▪franc can support more
languages(†) than any other library▪franc is packaged with support for
81, 186, or 384 languages▪franc has a CLI
Github: https://github.com/wooorm/franc
var franc = require('franc');
franc('Alle menslike wesens word vry'); //=> 'afr'franc(' এটি একটি ভাষা একক IBM স্ক্রি�প্ট'); //=> 'ben'franc('Alle menneske er fødde til fridom'); //=> 'nno'franc(''); //=> 'und'franc('the'); //=> 'und'/* You can change what’s too short (default: 10): */franc('the', {minLength: 3}); // 'sco
www.eliftech.com
2D JavaScript Physics Engine
7
Key motivations for the development of this project are:▪Taking advantage of Box2D's efforts and achievements▪Developing readable and maintainable JavaScript code▪Optimizing the library for web and mobile platforms▪Providing a JavaScript-friendly API
Check out: https://github.com/shakiba/planck.js Perceptual JPEG encoder
▪Guetzli is a JPEG encoder that aims for excellent compression density at high visual quality▪Guetzli-generated images are typically 20-30% smaller than images of
equivalent quality generated by libjpeg▪Guetzli generates only sequential (nonprogressive) JPEGs due to faster
decompression speeds they offerGithub: https://github.com/google/guetzli
www.eliftech.com
2D JavaScript Physics Engine
8
Key motivations for the development of this project are:▪Taking advantage of Box2D's efforts and achievements▪Developing readable and maintainable JavaScript code▪Optimizing the library for web and mobile platforms▪Providing a JavaScript-friendly API
Check out: https://github.com/shakiba/planck.js
www.eliftech.com
AR.js - Efficient Augmented Reality for the Web using ARToolKit
9
▪Very Fast : it runs efficiently even on phones. 60 fps on my 2 year-old phone!▪Web-based : It is a pure web solution, so no installation required. Full javascript
based on three.js + jsartoolkit5▪Open Source : It is completely open source and free of charge!▪Standards : It works on any phone with webgl and webrtc
Github: https://github.com/jeromeetienne/AR.js
www.eliftech.com
Angular 4.0.0 Now Available
10
▪Smaller & Faster▪New features (Improved *ngIf and *ngFor, Angular Universal, TypeScript 2.1
and 2.2 compatibility etc)Link: http://angularjs.blogspot.com.cy/2017/03/angular-400-now-available.html
Next.js 2.0 is out▪next release of universal apps framework▪New features▪Smaller builds▪Better Hot Modules Reloading and more
Link: https://zeit.co/blog/next2
www.eliftech.com
React JavaScript library gets an IDE
11
▪first dedicated IDE for React web application development▪custom simulator, making build-tool and server configuration unnecessary▪in active development
Follow: https://github.com/reactide/reactide
WebStorm 2017.1 released▪added support for such exciting technologies as Vue.js and Jest, brought more
flexibility to code styles, improved React and Angular support and moreCheck: https://blog.jetbrains.com/webstorm/2017/03/webstorm-2017-1/
www.eliftech.com
Browsers news
12
▪Safari 10.1 out https://webkit.org/blog/7477/new-web-features-in-safari-10-1/ ▪Firefox 54 dev edition
https://hacks.mozilla.org/2017/03/developer-edition-54-new-inspector-and-debugger-features/
▪Firefox 52https://hacks.mozilla.org/2017/03/firefox-52-introducing-web-assembly-css-grid-and-the-grid-inspector/
www.eliftech.com
Miscellaneous
13
▪The Future of Trust in Node.js Dependencieshttps://nodesource.com/blog/hello-certified-modules-the-future-of-trust-in-node-js-dependencies
▪Minecraft in WebVR with HTML Using A-Framehttps://css-tricks.com/minecraft-webvr-html-using-frame/
▪Facebook tool cuts through React Native complexityhttp://www.infoworld.com/article/3180446/mobile-development/facebook-tool-cuts-through-react-complexity.html#tk.rss_javascript
www.eliftech.com
Interesting statistics
14
▪Analysing the use of outdated JavaScript libraries on the webhttps://blog.acolyer.org/2017/03/07/thou-shalt-not-depend-on-me-analysing-the-use-of-outdated-javascript-libraries-on-the-web
▪77% of sites use at least one vulnerable JavaScript libraryhttps://snyk.io/blog/77-percent-of-sites-use-vulnerable-js-libraries/
▪Front-End Tooling Trends for 2017https://www.sitepoint.com/front-end-tooling-trends-2017/
www.eliftech.com 15
www.eliftech.com
Thank you for attention!Find us at eliftech.comHave a question? Contact us:[email protected]
