FEX 技术周刊 - 2020/03/23
深阅读
Wikimedia (The Folks Behind Wikipedia) Are Adopting Vue.js
https://phabricator.wikimedia.org/T241180
Wikimedia will be using Vue for their future front-end development, but no, Wikipedia is not becoming an SPA! This post digs into the how and why of the decision, while on Twitter, Vue.js creator Evan You explains more from his side. Hacker News had a very busy thread on the topic too. 另附：You probably don’t need a single-page application.
Please consider not adopting Google WebComponents
https://forum.palemoon.org/viewtopic.php?f=1&t=24004
https://news.ycombinator.com/item?id=22604070
Dear Web Developer(s), While, as a software developer ourselves, we understand very well that new features are exciting to use and integrate into your work, we ask that you please consider not adopting Google WebComponents in your designs. This is especially important if you are a web developer creating frameworks for websites to use. With Google WebComponents here we mean the use of CustomElements and Shadow DOM, especially when used in combination, and in dynamically created document structures (e.g. using module loading/unloading and/or slotted elements). 另附两个浏览器相关的：The reckless, infinite scope of web browsers, Things you can do with a browser in 2020.
How to do effective video calls
https://martinfowler.com/articles/effective-video-calls.html
During 2011-2012 there was a small but significant revolution in how we worked at ThoughtWorks. When we needed to communicate while separated we used to do telephone meetings, but within a year the telephone disappeared and we started using video calls instead. As we got more comfortable with video, we took more opportunity to collaborate with video meetings rather than trying to get everyone together in one place. Now the Coronavirus Disease 2019 (Covid-19) has struck, a lot more people are getting acquainted with remote working and the video calls that come with them. So I thought I’d share some of things I, and my colleagues, have learned about doing them.
7.9.0 Released: Smaller preset-env output, Typescript 3.8 support and a new JSX transform
https://babeljs.io/blog/2020/03/16/7.9.0
While preparing the Babel 8.0.0 release (in the next months), we just finished working on a new minor release which includes updates related to @babel/preset-env, TypeScript 3.8, Flow, and JSX!
An Interactive Introduction to AntV
https://observablehq.com/@jiazhewang/introduction-to-antv
AntV is an technology brand for data visualization. It contains multiple open-source JavaScript libraries to support visualization needs in various fields, including statistical charts, graph visualization, geospatial visualization and even automatic chart recommendation and generation. Tested by huge data business in Ant Financial Services Group and Alibaba Group, it can guarantee various data analysis scenarios. This notebook will introduce the capabilities of AntV in various aspects and show you related demos.
进无止境，AntV 统计图表 G2Plot 1.0 发布
https://www.yuque.com/antv/blog/igfe4h
G2Plot 是一个开箱即用、易于配置、体验优雅的统计图表库，致力于帮助用户以最小成本生成高质量统计图表。 G2Plot 最初诞生于阿里经济体 BI 产品真实场景的业务诉求。动态、高度不确定是 BI 产品和中台系统业务数据的一个普遍特征，而这种特征对统计图表的功能和体验提出了巨大的挑战。如何能够帮助报表系统和一线前端在复杂数据条件下快速高效地创建统计图表，同时保证图表在各种显示空间和数据状态下的可读性和可用性？ 为解决这两个痛点问题，AntV 与 DeepInsight、QuickBI 和 FBI，阿里经济体三个优秀 BI 产品技术团队联手打造了 G2Plot。自去年 11 月发布 0.x 试用版后，G2Plot 经历了 20 多个小版本的迭代优化，图表类型已从最常用的 7 个扩展到 40 多个，在核心 BI 产品真实场景上线验证后终于带来 1.0 正式版。希望我们在数据可视化业务，特别是 BI 产品中的开发和设计经验能够帮助到更多用户轻松制作优雅的统计图表。
前后端一体化：前后端分离将死
https://mp.weixin.qq.com/s/s7MwTrP-bsrlUAco1vNGTw
在所有的引子里， 我们已经准备了所有的论据，所以只需要：
- 使用可以跨前后端的语言，构建领域模型
- 将后端服务、前端设施细化为更小的组件
- 设计 DSL 将领域模型转换到特定平台的代码
你就可以杀死前后端分离，就是这么简单。前后端分离将死，不是现在，但是可能在五年后开始。你说呢？
React Production Performance Monitoring
https://kentcdodds.com/blog/react-production-performance-monitoring
How to set up performance monitoring for production React applications. 另附：5 Recommended Tools for Optimizing Performance in ReactJS.
How to Use WordPress with React to Build a Modern Web App
https://snipcart.com/blog/reactjs-wordpress-rest-api-example
WordPress REST API is a huge step forward for frontend developers looking to combine the power of JavaScript frameworks like React (or Vue.js) with WordPress. This is exactly what I want to do today with this demo of the WordPress REST API in the work. I’ll use WordPress as a backend, and the REST API to feed data into a React app.
‘CSS X’
https://www.w3.org/blog/2020/03/css-x/
CSS development started some 25 years ago. Originally the goal was to provide some good but simple typography for a single column of text with the occasional image. But the technology proved popular, and flexible enough that the scope could be made much wider. And since then the work of adding new capabilities hasn’t stopped. CSS now handles multiple columns, vertical text, diagonal text, layout for graphical user interfaces, image operations, animations, some key and mouse interaction, and more.
Neumorphism and CSS
https://css-tricks.com/neumorphism-and-css/
Neumorphism (aka neomorphism) is a relatively new design trend and a term that’s gotten a good amount of buzz lately. It’s aesthetic is marked by minimal and real-looking UI that’s sort of a new take on skeuomorphism — hence the name. It got its name in a UX Collective post from December 2019, and since then, various design and development communities have been actively discussing the trend, usually with differing opinions.
Do You Really Understand the Viewport
https://hackernoon.com/do-you-really-understand-the-viewport-lv663ye4
If you are a web developer, you must have heard about viewport, and the below line may seem familiar to you. <meta name=”viewport” content=”width=device-width, initial-scale=1" />. But do you really understand what this line of code actually does?
Creating a Pencil Effect in SVG
https://heredragonsabound.blogspot.com/2020/02/creating-pencil-effect-in-svg.html
Dragons Abound produces maps in SVG, which is a vector graphics format. Vector graphics have a lot of features (such as lossless zoom) that are nice for maps.
Rendering charts with OffscreenCanvas
https://blog.scottlogic.com/2020/03/19/offscreen-canvas.html
Rendering charts can be a very intensive operation for the browser, especially multiple charting widgets in the context of a wider application. OffscreenCanvas is growing in browser support and allows canvas rendering to be delegated to a WebWorker. This post looks at what performance improvements we can realistically expect and some gotchas that can crop up along the way.
The Rise of the No-Code Movement
https://www.sitepoint.com/the-rise-of-the-no-code-movement/
Over the past couple of years, the rise of the no-code movement has started to change the landscape of tech. Ironically, Lamdba School itself is a product of the no-code movement, building its MVP (that has served 3,000 students) using a combination of tools such as Typeform, Airtable, and Retool. The no-code movement has also been called low code or visual development. The makers of no-code platforms are still discussing the best label for the movement but for now, I will stick with ‘no-code’.
Serverless in the wild: characterizing and optimising the serverless workload at a large cloud provider
https://blog.acolyer.org/2020/03/20/serverless-in-the-wild/
Today’s paper analyses serverless workloads on Azure (the characterisation of those workloads is interesting in its own right), where users want fast function start times (avoiding cold starts), and the cloud provider wants to minimise resources consumed (costs).
Abstractions and serverless
https://blog.softwaremill.com/abstractions-and-serverless-3dfaccaf85b6
IT systems are inherently hard to comprehend. That’s why we divide systems into smaller pieces. If this division is done properly, instead of understanding everything about a system, we only need to understand each piece in isolation, and how the small pieces are composed. Performing the division “properly” is obviously not trivial, and is the crux of the problem, which we’ve been studying for quite some time.
How event-driven architecture solves modern web app problems
https://stackoverflow.blog/2020/03/16/how-event-driven-architecture-solves-modern-web-app-problems/
In this article, we’ll discuss some of the problems driving innovation in modern web development. Then we’ll dive into the basics of event-driven architecture (EDA), which tries to address these problems by thinking about back-end architecture in a novel way.
Ways to Compute Pi in SQL
https://www.memsql.com/blog/ways-to-compute-pi-in-sql/
In celebration of Pi Day, I asked MemSQL’s Engineering team to come up with clever ways to compute pi in SQL. Because that’s the kind of thing we engineers enjoy! And, given pi’s privileged status in mathematical history – and my own history of earning a bachelor’s degree in Mathematics – I just couldn’t resist.
What is the Future of Machine Learning?
https://codeburst.io/what-is-the-future-of-machine-learning-f93749833645
Machine Learning has been one of the hottest topics of discussion among the C-suite. The blog speaks about the future of Machine Learning. Read this to know more.
新鲜货
计算机界的最高奖，居然颁给了拍动画片的
http://www.geekpark.net/news/257218
3 月 18 日，国际计算机协会（ACM）公布了 2019 年图灵奖的获奖人，分别是计算机科学家、皮克斯动画工作室联合创始人 Edwin E. Catmull，以及来自斯坦福大学计算机图形学实验室教授 Patrick M. Hanrahan。
GitHub for mobile is now available
https://github.blog/2020-03-17-github-for-mobile-is-now-available/
At Universe, we announced GitHub for mobile as a fully-native GitHub experience on iOS and Android. Now, you can stay in touch with your team, triage issues, and even merge code, right from your mobile device, anywhere. 另附：Set up your digital classroom with GitHub Classroom.
npm is joining GitHub
https://github.blog/2020-03-16-npm-is-joining-github/
https://blog.npmjs.org/post/612764866888007680/next-phase-montage
The amazing energy and creativity of millions of JavaScript developers is evident every day in the work that appears in npm. We are honored to support that community in a new way. The future of npm and the JavaScript ecosystem is very bright.
Introducing MongoDB Developer Hub
https://www.mongodb.com/blog/post/introducing-developer-hub
We are excited to announce the launch of our new Developer Hub: https://developer.mongodb.com. The Developer Hub will serve as the central location for all MongoDB developer content, programs, and resources. We built the Developer Hub from the ground up to serve the needs of developers using MongoDB products like MongoDB Atlas and MongoDB Stitch.
Tabler Icons
https://github.com/tabler/tabler-icons
A set of over 300 free MIT-licensed high-quality SVG icons for you to use in your web projects. Each icon is designed on a 24x24 grid and a 2px stroke.
ERP beyond your fridge
https://grocy.info/
grocy is a web-based self-hosted groceries & household management solution for your home. Open Source. Built with passion.
React-Reverse-Portal
https://github.com/httptoolkit/react-reverse-portal
Build an element once, move it anywhere.
fdir
https://github.com/thecodrr/fdir
The fastest directory crawler for NodeJS. Crawls 1m files in < 1s
Ervy - Bring charts to terminal
https://www.chunqiuyiyu.com/ervy/
Bring charts to terminal.
μPlot
https://github.com/leeoniya/uPlot
A small (< 25 KB min), fast chart for time series, lines, areas, ohlc & bars (MIT Licensed)
Uppload
https://uppload.js.org/
Uppload is a better JavaScript image uploader. It’s highly customizable with 30+ plugins, completely free and open-source, and can be used with any file uploading backend.
heapify
https://github.com/luciopaiva/heapify
The fastest JavaScript priority queue out there. Zero dependencies.
Seafox
https://github.com/KFlash/seafox
A blazing fast 100% spec compliant, self-hosted javascript parser written in Typescript.
Neo - The webworkers driven UI framework (Beta version)
https://github.com/neomjs/neo
https://codeburst.io/introduction-guide-for-neo-mjs-the-webworkers-driven-ui-framework-c78471715f9d
This is a new paradigm. If you want to enter a new era of making better Web Based User Interfaces, the following concepts will be addictive.
Stateless Password Manager
https://lesspass.com/#/
Stop wasting your time synchronizing your encrypted vault. Remember one master password to access your passwords, anywhere, anytime. No sync needed.
Activists created a 12.5 million block digital library in ‘Minecraft’ to bypass censorship laws (MSFT)
https://www.pulse.com.gh/bi/tech/activists-created-a-125-million-block-digital-library-in-minecraft-to-bypass/bn4gpcc
Reporters Without Borders created “The Uncensored Library” within “Minecraft” as what it calls a “loophole to overcome censorship.” The digital library in an open “Minecraft” server has articles and information that has been censored in many countries, but is accessible through the game. RSF said that it chose “Minecraft” because it is available in many more places than sensitive information likely to be censored. For example, Yulia Berezovskaia, editor-in-chief of the Russian news site grani.ru, which is blocked in Russia, said she’s working with RSF to republish articles from her website on “Minecraft.”
Icon - Organize SVG icons in one place
https://iconset.io/
Free, cross-platform and fast SVG icon manager app for designers, developers or product teams. Works on both Mac and Windows.
设计
Why UX Should Be an Integral Part of Your Agile Workflow
https://www.infoq.com/presentations/ux-ba-agile/
Kevin Guenther is a Principal Consultant of User Experience (UX) Design, Kevin helps define and drive the future of Online clients’ digital experiences. He identifies and sets product strategies, envisions UX ecosystems and inspires project teams to push the boundaries of what’s possible. Kevin brings with him 20 years of knowledge in human-computer interaction and excellence in design execution.
Bonnaroo Music & Arts Festival: Site Redesign
https://uxplanet.org/bonnaroo-music-arts-festival-site-redesign-7deac38e1617
In this 2.5 week project, assigned by Ironhack — Amsterdam, I worked solo to design a festival website with a one-year life cycle. The one-year cycle included three stages: pre-event, during event, and post-event. My primary focus was on the pre-event (hype and ticket sales) stage. Relating my design to the existing brand identity and site history was a key requirement of the final design.
中国设计师不容小觑,AntDesign有望成为世界级设计体系
https://mp.weixin.qq.com/s/iFsMB6VHrR4w3Wo3mfYLYw
Ant Design是第一个由国内团队开发的面向世界的集视觉规范、交互模式、前端组件于一体的设计语言。去年 Ant Design 发布了全新的3.0体系，带来了全面的设计系统革新。而最近，蚂蚁金服体验技术部 UED，对外正式发布了 Ant Design 4.0，较往常不一样的是，这是一次非常大的突破，升级。也代表着 Ant Design 将从 UI 组件库的概念升级至面向企业级的设计体系，这在国内也好，或在全世界也好，都属于领先水平。
为什么支付宝要换 Logo 颜色？分析下目前 Logo 的主色趋势
https://www.uisdc.com/alipay-logo-design
最近支付宝变更了主色，将本来的天蓝色变更成了深蓝色，相信大家都已经在各个平台的推送新闻中关注到这个消息，我们来看看色彩的对比。我要从这个事件入手，来分析下现在UI主色定义的大趋势和成因。
「云游敦煌」小程序背后的设计故事
https://cdc.tencent.com/2020/03/20/design-story-of-dunhuang-trip-2/
莫高窟久远而璀璨的文化，应该被更多人看见。帮助更多人探索、游览、守护莫高窟，是我们产品的愿景。让游览敦煌，变成随时随地。作为设计团队，把远在西北中敦煌石窟的感受，转译到每个老百姓的指尖，是这次我们要解决的难题。
My Thoughts on Framer X
https://blog.prototypr.io/my-thoughts-on-framer-x-81abd13bcdf7
I started my first ever co-op internship this past winter as a UI/UX designer at a fin-tech company. In short, I joined when the company was at a huge overhaul, the design team being no exception. Originally using Sketch to design and InVision to prototype, the team was interested in integrating a new design tool to their belt, Framer X, “a lightning fast interactive design tool” that could hopefully fulfill our needs for both. I took some time to play around with Framer and present my findings with the team.
产品及其它
The End of Starsky Robotics
https://medium.com/starsky-robotics-blog/the-end-of-starsky-robotics-acb8a6a8a5f5
In 2015, I got obsessed with the idea of driverless trucks and started Starsky Robotics. In 2016, we became the first street-legal vehicle to be paid to do real work without a person behind the wheel. In 2018, we became the first street-legal truck to do a fully unmanned run, albeit on a closed road. In 2019, our truck became the first fully-unmanned truck to drive on a live highway.
ReMarkable’s redesigned e-paper tablet is more powerful and more papery
https://techcrunch.com/2020/03/17/remarkables-redesigned-e-paper-tablet-is-more-powerful-and-more-papery/
https://sspai.com/post/59339
Designed for the creation and consumption of monochromatic content like long documents, e-books, notes and sketches, the reMarkable set itself apart as a more minimalist alternative (or complement) to the likes of the iPad or Surface.
Ten Tips for Cultivating Creativity, From the Director of the Lifelong Kindergarten Group at MIT
https://thereader.mitpress.mit.edu/ten-tips-for-cultivating-creativity/
The challenge is not how to “teach creativity” to children, but rather how to create a fertile environment in which their creativity will take root, grow, and flourish.
对数据可视化有兴趣的可以阅读由 AntV 带来的 墨者修齐 2020-03-22·上手 G6 小 tips、Introduction to AntV、A Model of Breast Cancer Causation、ChartIO: a visual version of SQL
