2018.08.06 - Fusion.js: A Plugin-based Universal Web Framework
Ping Xia
Title: 2018.08.06 - Fusion.js: A Plugin-based Universal Web Framework
Deep Reading
The Cost Of JavaScript In 2018 https://medium.com/@addyosmani/the-cost-of-javascript-in-2018-7d8950fbb5d4 Byte‑for‑byte, JavaScript is still the most expensive resource we send to mobile phones, because it can delay interactivity in large ways. Today we’ll cover some strategies you can use to deliver JavaScript efficiently while still giving users a valuable experience.
Introducing Fusion.js: A Plugin-based Universal Web Framework https://eng.uber.com/fusionjs/ A little‑known fact is that Uber builds a lot of web‑based applications—hundreds of them and counting, in fact. Many are internal tools for managing various aspects of the business, while others are public‑facing. A more well‑known fact is that web technologies change quickly and best practices are constantly evolving. Providing a high‑quality framework with modern features to hundreds of web engineers while keeping up with the dynamic nature of the web platform has historically been a challenge. To address this, Uber’s Web Platform team built Fusion.js, an open‑source web framework that makes web development easier and produces lightweight, high‑performing apps.
A Look Ahead: Web Development Predictions http://blog.wolksoftware.com/a-look-ahead-web-development-predictions In this post I’d like to share some predictions about the world of web development. Making predictions is dangerous because they’re likely to be wrong. However, I enjoy thinking about the future because it’s exciting and can help us spot potential career opportunities. Remember that all innovations start as a fantasy.
React v16.4.2: Server‑side vulnerability fix https://reactjs.org/blog/2018/08/01/react-v-16-4-2.html We discovered a minor vulnerability that might affect some apps using ReactDOMServer. We are releasing a patch version for every affected React minor release so that you can upgrade with no friction. Read on for more details.
Node.js: A Brief Look at High Concurrency and Distributed Clusters https://zhuanlan.zhihu.com/p/41118827 Although Node’s single‑threaded nature brings many challenges to the services it provides, as long as we face these issues head‑on and use sensible methods (such as the child_process module or building distributed clusters) to solve them, we can leverage Node’s many advantages and reap its benefits!
Node Incident Investigation – Reconstructing Online Exceptions from Core Dumps https://zhuanlan.zhihu.com/p/41178823 Node.js has grown to be widely used in BFF front‑back separation, full‑stack development, client‑side tooling, and more. Yet, for most developers with a front‑end background, the runtime remains a “black box,” which hampers Node.js adoption in production. This article introduces a method for analyzing and locating online application failures based on core dumps.
ProseMirror – A Modular Rich‑Text Editing Framework https://juejin.im/post/5b5061d051882519a62f6164 Introduction to ProseMirror’s implementation
Flexbox – I Can Finally Say I Understand It https://mp.weixin.qq.com/s?__biz=MzA5NzkwNDk3MQ==&mid=2650587826&idx=1&sn=785aa994a3f046f55c21b2c147863967 The container‑related Flex properties are easy to grasp, but the properties for flexible items are not. More precisely, flex‑grow, flex‑shrink, and flex‑basis are the tricky ones. Only after mastering these three can you truly claim to understand Flexbox. Also see: What Happens When You Create A Flexbox Flex Container
Jenkins Pipeline Scripts in Meituan’s Food‑Service SaaS https://tech.meituan.com/erp_cd_jenkins_pipeline.html There are many ways to build with Jenkins; the “freestyle” style (a Jenkins build that combines SCM and a build system to construct your project, even non‑software systems) is common. For a single simple project this works fine, but when you have many similar yet slightly different projects, maintaining dozens of jobs becomes a nightmare—one small change forces edits across many jobs. Our team faced exactly this problem. This article shares a Pipeline‑based solution to address it. Also see: Demo: GitLab + Jira + Jenkins
Google Announces Grab‑and‑Go Program for Chromebooks, Powered by Angular https://blog.angular.io/google-announces-grab-and-go-program-for-chromebooks-powered-by-angular-7954c11900bd Last week at Google Cloud Next, the Grab‑and‑Go team showcased their newly announced Grab‑and‑Go program: a self‑service solution for enterprises to automate Chromebook asset management. An Angular application powers this program, automatically handling Chromebook assignments based on user logins. All of Google’s internal loaner Chromebook fleet is managed with this program, serving 30,000 unique users and over 100,000 loans last year. Also see: What’s New in WebStorm for Angular
The Web Push Checklist https://www.ebayinc.com/stories/blogs/tech/the-web-push-checklist/ We used a checklist‑based approach to enable Web Push. This checklist captures our learnings and research to provide the best user experience when dealing with notifications. In this post we outline that checklist.
I Created the Exact Same App in React and Vue. Here Are the Differences https://medium.com/javascript-in-plain-english/i-created-the-exact-same-app-in-react-and-vue-here-are-the-differences-e9a1ae8077fd I’d read the React docs and watched a few tutorial videos and, while they were great and all, what I really wanted to know was how different React was from Vue. By “different,” I didn’t mean things such as whether they both had virtual DOMs or how they rendered pages. I wanted someone to take the time to explain the code and tell me what was going on! I was looking for an article that broke down those differences so that a newcomer to either Vue or React (or web development in general) could gain a clearer understanding.
Node.js Best Practices https://github.com/i0natan/nodebestpractices The largest Node.js best‑practices list. Also see: We’re under attack! 23+ Node.js security best practices
Introducing Clinic Bubbleprof, a Unique Way to Visualise Node.js Code https://www.nearform.com/blog/introducing-clinic-bubbleprof-a-unique-way-to-visualise-node-js-code/ In a nutshell, Bubbleprof observes the async operations of your application, groups them, measures their delays, and draws a map of the delays in your app’s async flow. The tool’s power was recently demonstrated when it uncovered inefficiencies in both the Fastify web framework and in Node.js core itself! The team has written a deep‑dive blog post on Bubbleprof’s features, technology, and usage. In this post I’ll cover some high‑level topics.
What Do You Need to Know When Converting a Flash Game into HTML5 https://www.smashingmagazine.com/2018/07/converting-flash-game-html5/ The tips in this article aim to help HTML5 game developers avoid common pitfalls when porting Flash games to JavaScript, and to make the whole development process as smooth as possible. Basic knowledge of JavaScript, WebGL, and the Phaser framework is required.
Xamarin vs React Native: The Complete Guide https://www.uruit.com/blog/2018/07/25/xamarin-vs-react-native/ Tips for selecting the ideal cross‑platform mobile development framework for your project.
Originally written by Ping Xia (平侠) and published in Chinese on Web技术周刊 (Web Tech Weekly). Translated and adapted for DriftSeas with permission.
Sources & References
- [1]https://medium.com/@addyosmani/the-cost-of-javascript-in-2018-7d8950fbb5d4
- [2]https://eng.uber.com/fusionjs/
- [3]http://blog.wolksoftware.com/a-look-ahead-web-development-predictions
- [4]https://reactjs.org/blog/2018/08/01/react-v-16-4-2.html
- [5]https://zhuanlan.zhihu.com/p/41118827
- [6]https://zhuanlan.zhihu.com/p/41178823
- [7]https://juejin.im/post/5b5061d051882519a62f6164
- [8]https://mp.weixin.qq.com/s?__biz=MzA5NzkwNDk3MQ==&mid=2650587826&idx=1&sn=785aa994a3f046f55c21b2c147863967
- [9]What Happens When You Create A Flexbox Flex Container
- [10]https://tech.meituan.com/erp_cd_jenkins_pipeline.html
- [11]Demo: GitLab + Jira + Jenkins
- [12]https://blog.angular.io/google-announces-grab-and-go-program-for-chromebooks-powered-by-angular-7954c11900bd