2018.11.26 - The State of JavaScript 2018

Title: 2018.11.26 - The State of JavaScript 2018

Industry Conferences

Second Vue Conf https://vue.w3ctech.com/ – a showcase of the latest Vue practices.

In‑Depth Reading

The State of JavaScript 2018 https://2018.stateofjs.com/
That’s where the State of JavaScript survey comes in: this year we surveyed over 20,000 JavaScript developers to find out what they’re using, what they’re happy with, and what they want to learn. The result is a unique collection of stats and insights that will hopefully help you navigate the JavaScript ecosystem. Also included: Most Popular Node.js Frameworks in 2018, 10 Things to Learn to Become a Solid Full‑Stack JavaScript Developer.

Why React Hooks, and How Did We Even Get Here? https://medium.freecodecamp.org/why-react-hooks-and-how-did-we-even-get-here-aa5ed5dc96af
Hooks learn from the trade‑offs of mixins, higher‑order components, and render props to give us new ways to create contained, composable behavior that can be consumed in a flat, declarative manner.

Experimenting with Brain‑Computer Interfaces in JavaScript https://medium.com/@devdevcharlie/experimenting-with-brain-computer-interfaces-in-javascript-8d6cb891fda8
For the past couple of years I’ve been increasingly interested in neurotechnology. This post shares what I’ve learned and hopes to help anyone who wants to get started.

Using a Headless Browser to Capture Page Screenshots https://bitsofco.de/using-a-headless-browser-to-capture-page-screenshots/
Headless browsers are great for automating website tests because they let us navigate and act on pages without opening a real browser. Another excellent use case is dynamically taking screenshots of web pages.

WebSockets – A Conceptual Deep‑Dive https://www.ably.io/concepts/websockets
The WebSocket protocol expanded what’s possible for real‑time communication on the web. This article builds a deeper understanding of what WebSockets are, how they originated, and what’s happening under the hood of applications that use them. (Details are accurate as of the time of writing.)

Year‑End Review: A “Frontend Technology Checklist” https://juejin.im/post/5bdfb387e51d452c8e0aa902
Based on work experience, I abstracted a set of core frontend skills and organized the best content I’ve learned or produced recently according to those skills, creating a checklist that includes many standout articles from this year.

SVG vs Image, SVG vs Iconfont https://aotu.io/notes/2018/11/23/SVG_vs_Image_vs_iconfont/index.html
SVG vs Image: Apart from complex graphics, using inline SVG or the <img/> tag to embed SVG is generally better than using separate image files or CSS sprites.
SVG vs Iconfont: Inline SVG can be a solid alternative to icon fonts.

Hades: A Mobile Static‑Analysis Framework https://tech.meituan.com/hades.html
Meituan’s static‑analysis framework Hades is named after the Greek god of the underworld. Hades, the impartial judge of souls, can discern right from wrong. The framework provides semantic analysis capabilities; we hope it can do more than just a traditional linter and become a foundation for many other tools, helping us examine code and manage large projects more easily.

[Translation] The Journey of Improving Google Photos Web UI https://zhuanlan.zhihu.com/p/50280008
A few years ago I was fortunate to join the Google Photos team as an engineer and work on the first version released in 2015. I was responsible for the web UI, specifically the photo grid layout. Our ambition was to create a perfect layout: full‑screen responsive, preserving original aspect ratios, easy interaction (e.g., jumping to a specific position), displaying massive numbers of photos while keeping the page fast and performant. At the time, no other photo‑album product achieved all of these goals, and to my knowledge none has matched Google Photos yet. Most products still crop images to squares for aesthetic consistency. Below I’ll share how we tackled these challenges and some technical details of the web version of Google Photos.

[Translation] What Do Front‑End Interviews Talk About in 2019? https://mp.weixin.qq.com/s/e-IC588SZPJK2QRBm3KuHA
Interviews are a great way to spark change and attract talent. If you, as an interviewer, treat an interview as just “an interview,” you’ll only inflate your ego and gain nothing. A successful interview must be a discussion—a place for exchanging ideas, prompting thoughtful analysis of problems, understanding decision‑making processes, and gauging a candidate’s passion for technology and problem‑solving. It’s also about getting to know potential future colleagues. Trivia, tricks, or “typeof null” questions aren’t real interviews. Below are some questions we’ve used in interview discussions, intended to help both interviewers and candidates clarify expectations, needs, and reality.

Why Angular Made Me Quit Web Dev https://hackernoon.com/why-angular-made-me-quit-web-dev-f63b83a157af
Angular. Its very name is a tongue‑twister. Say it slowly: /’eŋgjəlɚ/. The throat contorts around this alien word, which evokes ugliness, sharpness, and artificiality. Test subjects worldwide overwhelmingly associate those three adjectives with the same three shapes. Here I’ll illustrate how my psyche was irreversibly traumatized by this chaotic, demon‑dropping, Google‑born creation: the ANGULAR WEB DEVELOPMENT FRAMEWORK.

Braces to Pixels https://alistapart.com/article/braces-to-pixels
Doesn’t CSS feel like magic? In this third installment of “URL to Interactive” we’ll follow the journey your browser takes to turn CSS from braces to pixels. As a bonus we’ll briefly touch on how user interaction affects this process. We have a lot to cover, so grab a cup of <insert your favorite drink’s name here> and let’s get started.

Web Workers vs Service Workers vs Worklets https://bitsofco.de/web-workers-vs-service-workers-vs-worklets/
Web workers, service workers, and worklets are all scripts that run on separate threads. What are the differences among these three types of workers?

Electrode Confippet https://medium.com/walmartlabs/electrode-confippet-85bafe1c9a42
Electrode, an open‑source platform from WalmartLabs, is used for building powerful web and mobile applications. Electrode Confippet is one of many modules in Electrode Web and manages configuration for Node.js applications. This post takes a deeper look at Electrode Confippet.

Steal This Dashboard! Every Insights Chart Type in One Dashboard https://blog.newrelic.com/product-news/steal-this-dashboard/
To demonstrate New Relic Insights dashboard capabilities, we built a dashboard that includes every possible way to visualize APM and page‑view data—the “All Chart Types” dashboard. These visualizations (charts) come in various widget formats and are built using New Relic Query Language (NRQL) queries.

Some Notes About HTTP/3 https://blog.erratasec.com/2018/11/some-notes-about-http3.html#.W_p2ZGQzanc
HTTP/3 is on its way to becoming a standard. As an old‑school protocol enthusiast, I thought I’d jot down some thoughts.

Flutter: The Good, the Bad, and the Ugly https://medium.com/asos-techblog/flutter-vs-react-native-for-ios-android-app-development-c41b4e038db9
After creating my first app with Flutter, I weigh its pros and cons against the other major cross‑platform contender—React Native. Also see: Google releases Dart 2.1, teases Flutter 1.0.

Dynamic Configuration at Twitter [https://blog.twitter.com/engineering/en_us/topics/infrastructure/2018/dynamic-configuration-at-twitter.html](https://blog.twitter.com/engineering/en_us/topics/

(content truncated)

---

Originally written by Ping Xia (平侠) and published in Chinese on Web技术周刊 (Web Tech Weekly). Translated and adapted for DriftSeas with permission.