FEX 技术周刊 - 2019/04/22
Blazingly fast parsing, part 2: lazy parsing
Parsing is the step where source code is turned into an intermediate representation to be consumed by a compiler (in V8, the bytecode compiler Ignition). Parsing and compiling happens on the critical path of web page startup, and not all functions shipped to the browser are immediately needed during startup. Even though developers can delay such code with async and deferred scripts, that’s not always feasible. Additionally, many web pages ship code that’s only used by certain features which may not be accessed by a user at all during any individual run of the page.
A Closer Look at React Memoize Hooks: useRef, useCallback, and useMemo
The best way to understand what memoize hooks are is to expose ourselves to the problem space which these hooks solve. Starter hooks examples don’t expose these problems. They make hooks look approachable and straightforward— which makes complete sense. The real problem starts to unravel when you use hooks more often. Spend a few more hours if you are a hooks beginner, and you will find yourself in weird pitfalls that you would not have noticed on your first day with React.
Introducing Mozilla WebThings
https://hacks.mozilla.org/2019/04/introducing-mozilla-webthings/ The Mozilla IoT team’s mission is to create a Web of Things implementation which embodies those values and helps drive IoT standards for security, privacy and interoperability. Mozilla WebThings is an open platform for monitoring and controlling devices over the web, including:
- WebThings Gateway – a software distribution for smart home gateways focused on privacy, security and interoperability
- WebThings Framework – a collection of reusable software components to help developers build their own web things 另附，来自 Mozilla 的黑科技：
- Fluent 1.0: a localization system for natural-sounding translations
- Pyodide: Bringing the scientific Python stack to the browser.
User Interfaces You Can Trust With State Machines
In this article, we use this simple online movie search application to explain how using explicit state machines in the modelization and implementation of user interfaces leads to robust, maintainable and testable interfaces. We start by describing the search application and end by presenting the state machine formalism. In this process, we will reveal how the implicit state machine complicated our code and show the advantages of using an explicit state machine instead.
How Do We Really Use Reusable Components?
I’ve talked to 30 teams about their reusable components. Here’s what I’ve learned.
《架构整洁之道》以及《A Philosophy of Software Design》等书中以及许多大牛的博客都明示或暗示过在实现领域逻辑时不要基于其他外部依赖进行。但是这一点在前端开发中似乎比较困难：1. 目前主流的框架如 React 和 Vue 提供的状态管理工具 Redux 或者 Vuex 等都规定好了实现领域逻辑的方式；2. 许多逻辑事实上与 View 层的状态强相关而较难剥离；3. 即便从状态管理中强行抽出一个 Service 层，还是会有大量的逻辑分散于 View 层与状态管理框架的流程控制中，而实际的 Service 层（或者更准确一点叫做 Api 层）似乎除了包装了几个常用的函数之外并没有提供更好的抽象。那么是由于目前许多前端页面中的领域逻辑本身比较简单造成了并没有抽象Service的必要，还是 React、Vue 这些框架本身在设计时过于 Opinionated，导致想从中剥离出独立的领域逻辑很困难？
4 月 18 日，微软正式发布了一种名为 Bosque 的全新编程语言。微软方面介绍说：Bosque 受 TypeScript 启发，是一种超越了结构化编程且没有循环的编程语言，他们认为，这种规范化的编程模型将极大地提高开发人员的生产力，提高软件质量，并使编译器和开发人员工具的开发进入第二个黄金时代。另附：Go 会接替 Java，成为下一个企业级编程语言吗。
三年前，我写了这篇博客使用开源软件快速搭建数据分析平台， 当时收到了许多的反馈，有50个点赞和300+的收藏。到现在我还能收到一些关于dataplay2的问题。在过去的三年，开源社区和新技术的发展可谓日新月异，我希望试试利用最新的技术来帮助没有数据科学背景的人也能够轻松的进行数据分析和预测，于是就有了 dataplay3 。
第九期杭州 NodeParty 回顾
- 第一场：应杲臻，贝贝集团，《Node 调用 dubbo 服务的探索与实践》
- 第二场：杨力，微店，《一套针对传统后端开发人员开箱即用的 Node EE 解决方案 Rockerjs》
TDD Changed My Life
Whenever somebody asks me why they should bother with TDD, I’m reminded of this story — and dozens more like it. One of the primary reasons I switched to TDD is for improved test coverage, which leads to 40%-80% fewer bugs in production. This is my favorite benefit of TDD. It’s like a giant weight lifting off your shoulders. 另附：How to know what to test.
You can use emoji (and other graphical unicode characters) in URLs. And wow is it great. But no one seems to do it. Why? Perhaps emoji are too exotic for normie web platforms to handle? Or maybe they are avoided for fear of angering the SEO gods?
Best practices for optimising video streams on the web
When I think of video streaming, I typically think of Netflix, Amazon or YouTube — the major providers of video on the web today. When I think of “video on the web,” I generally think about pages with a background video, or another fun immersive feature that makes the page engaging. Generally (as a web developer), I assume that these pages use the video tag, not streaming. However, if the top companies delivering video content on the web are streaming their videos – and most other pages are not – is there something that can be learned here? Could streaming video be faster, more efficient, and have a better customer experience?
Choosing the right Node.js Framework: Next, Nuxt, Nest?
In this blog post, I’m going to examine the differences between three more very popular frameworks: Next, Nuxt, and Nest. These three frameworks are server-side rendering, and they are closely related to React, Vue, and Angular (the three most widely used front-end frameworks), respectively.
How JSON Web Token (JWT) Secures Your API
You’ve probably heard that JSON Web Token (JWT) is the current state-of-the-art technology for securing APIs. Like most security topics, it’s important to understand how it works (at least, somewhat) if you’re planning to use it. The problem is that most explanations of JWT are technical and headache inducing. Let’s see if I can explain how JWT can secure your API without crossing your eyes!
White Paper: Thinking differently - the cloud as a value driver
One of the greatest technology enablers of the past decade is public cloud. The strategic importance of this has been widely accepted by the industry, however, the prevailing focus on the cloud as a means to reduce costs, is overlooking its greatest capability: agility! The public cloud provides a platform for change, and a foundation for business agility. It allows you to create new services, experiment with new technology, explore SaaS offerings and provide greater user engagement with a rapid time-to-market.
The Web Developer’s Guide to DNS
What is a manifold?
In machine learning, the term manifold is thrown around a lot—in fact, there’s even a branch of machine learning dealing with learning the structure of manifolds. Said branch is aptly named manifold learning. Inspired by fantastic visualizations of shapelet mining algorithms, this post aims to give a visual introduction to manifolds that is accessible for non-mathematicians and mathematicians alike.
GitHub Release Radar · March 2019
Introducing Base Web, Uber’s New Design System for Building Websites in React
Uber assembled a dedicated design and engineering team to come up with a universal system, which resulted in the Base Web design system. Open sourced in 2018, Base Web is a React component library implementing the Base design language that acts as a device-agnostic foundation for quickly and easily creating web applications.
A simple React component capable of building HTML forms out of a JSON schema and using Bootstrap semantics by default.
A React.js based library for creating sleek presentations using JSX syntax that gives you the ability to live demo your code.
A React component for playing a variety of URLs, including file paths, YouTube, Facebook, Twitch, SoundCloud, Streamable, Vimeo, Wistia, Mixcloud, and DailyMotion.
Create PDF files using React.
Detect the file type of a Buffer/Uint8Array/ArrayBuffer The file type is detected by checking the magic number of the buffer.
Node.js powered End-to-End testing framework. Nightwatch is a complete and integrated solution for end-to-end testing of web applications and websites, and also for Node.js unit and integration testing.
An Overview of Go’s Tooling
In this post I hope to provide a little background and context about the tools I find most useful, and importantly, explain how they can fit into the workflow of a typical project. I hope it’ll give you a good start if you’re new to Go. The information in this post is written for Go 1.12 and assumes that you’re working on a project which has modules enabled.
Building intelligent systems starts at the database
Grakn is the knowledge graph engine to organise complex networks of data and making it queryable, by performing knowledge engineering. Rooted in Knowledge Representation and Automated Reasoning, Grakn provides the knowledge foundation for cognitive and intelligent (e.g. AI) systems, by providing an intelligent language for modelling, transactions and analytics. Being a distributed database, Grakn is designed to scale over a network of computers through partitioning and replication.
Panic’s Next Editor
Twelve years ago we introduced Coda, the world’s first web development editor. It put the tools you needed to make a web page together in one app, and nobody had ever done that before. But a lot has changed since then. Websites are now more like applications in the way they’re built and run. Deployment is much more complex than an FTP upload. Languages, frameworks, toolchains — and possibilities — have exploded. We had to make a difficult choice: rewrite Coda for this new world, or leave it behind?
Erlang 之父 Joe Armstrong 去世了
Joe Armstrong 他的论文《面对软件错误构建可靠的分布式系统》可以说是必然载入史册，把 erlang 的设计思想一一道来，甚至可以说是其世界观与哲学了：一切皆进程；进程强隔离；进程的生成与销毁都是轻量的操作；消息传递是进程交互的唯一方式；每个进程有唯一的名字；你若知道进程的名字，就可以向他发消息；进程之间不共享资源；错误处理非本地化；进程要么正常跑着，要么马上挂掉；就以上九条的观念，设计出的 erlang 语言，成就了可靠性达到99.9999999%的目前世界上最复杂的 ATM 交换机。附：如何评价 Joe Armstrong 在计算机领域的贡献。
Sketch vs Figma, Adobe XD, And Other UI Design Applications
For a while now, Sketch has been the de facto application of choice for UX and UI designers. But in the last year or two, we have seen many new contenders for the Sketch’s crown. Two of them that have made the biggest strides are Figma and Adobe XD. In this article, I’ll try to summarize my thoughts on how these apps compete with Sketch and what are their unique features.
Design Your Team
Introducing the Team Values Toolkit — a new way to design and align on work culture.
Game Design UX Best Practices
What are the best practices for major game mechanics you should implement in your mobile games? Here’s the ultimate guide for game designers with lessons learned from +250 games. 另附：Visual Design Terms Cheat Sheet.
Why Designers Should Understand Code
Take note, I do not mean that designers need to be full stack engineers, but I strongly advocate that designers should have a good grasp of some basic technical concepts. This will of course will reduce friction and help your team produce better products always, and ultimately make you much better at your job.
Customer-focused Content: Creating Content People Want and Need
The world does not need more content. People are overwhelmed with content. Bombarded every day by ads, social posts, feeds, emails, search results, endless information – most of which they don’t want or care about. The harsh reality is most people aren’t interested in your content. Regardless of business or industry, audiences expect engaging, useful content tailored to their needs.
Why software projects take longer than you think – a statistical model
Anyone who built software for a while knows that estimating how long something is going to take is hard. It’s hard to come up with an unbiased estimate of how long something will take, when fundamentally the work in itself is about solving something. One pet theory I’ve had for a really long time, is that some of this is really just a statistical artifact.
宿命之战：程序员 VS 产品经理
对数据可视化有兴趣的可以阅读由 AntV 带来的 墨者修齐 2019-04-22 · 可视化在多尺寸设备下的兼容性处理、StoryMap、Story Explor
– THE END –