JavaScript Icon

JavaScript

JavaScript is an object-oriented programming language used alongside HTML and CSS to give functionality to web pages.
672 Stories
All Topics

The Changelog The Changelog #349

The state of CSS in 2019

We’re talking with Sacha Greif to discuss the State of CSS survey and results. CSS is evolving faster than ever. And, coming off the heels of their annual State of JavaScript survey, they’ve decided to take on the world of styles and selectors to help identify the latests patterns and trends in CSS. We talk through the history and motivations of this survey, the methodology of their data collection, the tooling involved to build and run the survey, and of course we dig deep into the survey results and talk through the insights we found most interesting.

read more

Kevin Ball DEV.to

Let’s talk testing: 4 quick lessons on the philosophy of testing

Inspired by JSParty #70, 4 quick lessons on the philosophy of testing. The motivation? Tools like Mocha, Jasmine and Jest have made writing tests far easier… But there’s still a gap. It’s extremely hard to find information on the philosophy of testing. What to test and why. How much is enough? What type of tests should I be writing, and when does it fit into my process?

read more

JavaScript martinfowler.com

Micro frontends

What’s the front-end equivalent of a micro-services architecture? A micro-frontends architecture of course. This approach makes a ton of sense, though in my opinion you will definitely want to have an internal components library and some cross-frontend coordination so your UI doesn’t degrade into a series of disconnected, disjointed experiences. It’s hard to argue against the benefits stated by author Cam Jackson: Micro frontends are all about slicing up big and scary things into smaller, more manageable pieces, and then being explicit about the dependencies between them. Our technology choices, our codebases, our teams, and our release processes should all be able to operate and evolve independently of each other, without excessive coordination.

read more

James Sinclair jrsinclair.com

Magical, mystical JavaScript transducers

A fascinating read on how transducers work, building them up from scratch from reducers using JavaScript, then showing how to uses built-in transducers from Ramda. And if all that sounds like gobbledygook, you’re not alone - but read this article and it will start to make sense. :) Author James Sinclair on why bother learning this challenging concept: A solution that would give us the elegance of using small, simple functions. But also the efficiency of doing our processing in a single pass through the array. What is this magical solution? It’s a concept called a transducer.

read more

JavaScript arp242.net

An argument for jQuery in 2019

We all love to hop on the latest JavaScript bandwagon - and there are some amazing things you can do with modern frameworks. Modern JavaScript and DOM APIs are much improved as well, with a movement to ditch jQuery in favor of vanilla javascript. But Martin Tournoij also has a pretty good case for why jQuery might still be pretty nice, starting with: Pages like You might not need jQuery try to sell the idea that it’s easy to ditch jQuery, but the very first example is a good reason to use jQuery: one line of trivial jQuery code gets replaced with 10 lines of vanilla JS code!

read more

Kevin Ball zendev.com

Top 5 skills to learn as a junior JavaScript developer

Inspired by JSParty #77, a breakdown of 5 of the top skills for junior JavaScript developers to learn. My personal favorite point is this one on the importance of looking for bigger picture patterns: One of the great things about front-end development in 2019 is that despite the abundance of frameworks, we’ve also started to see some big megatrends that are true across frameworks. This is good news for developers because it means that as you go deep in one framework you can still pick up skills that will translate to others if need be.

read more

James Sinclair jrsinclair.com

Functional JavaScript: how to use Array Reduce for more than just numbers

I’m blown away by the clarity of explanation in this post, and came away with it excited to start using Reduce way more. Definitely worth a read to level up your game. Reduce is the Swiss-army knife of array iterators. It’s really powerful. So powerful, you can build most of the other array iterator methods with it, like .map(), .filter() and .flatMap(). And in this article we’ll look at some more amazing things you can do with it. But, if you’re new to array iterator methods, .reduce() can be confusing at first.

read more

Smashing Magazine Icon Smashing Magazine

Vue.js and SEO: how to optimize reactive websites for search engines and bots

Real life data on how Google indexes javascript-rendered websites today. This has been a controversial subject, and this article by no means settles it entirely, but provides some strong data for what types of dynamic content are well indexable and which are not. Though to be honest, I think the most important conclusion the author makes might be this one: If you need your site to perform on search engines other than Google, you will definitely need pre-rendering of some sort.

read more

WebAssembly ebayinc.com

WebAssembly at eBay: a real-world use case

An interesting example of porting a native/mobile custom library to the web using webassembly. Didn’t work as expected out of the box, so they ported another custom library and raced them. Then added a JavaScript implementation for a trifecta. Love that they shared the actual customer-facing results too. As authors Pranav Jha and Senthil Padmanabhan say: Technology evolves at a very rapid pace. Every day we hear new things getting launched. But only a few make a difference to customers, and WebAssembly is one of them.

read more

Smashing Magazine Icon Smashing Magazine

Demystifying JAMstack: an interview with Phil Hawskworth

JAMStack is all that, whole grain low fat, I know you want a piece of that… No but seriously now, I love what’s going on with the JAMstack and the implications for performance, security, and maintainability. Not sure what this stack even is? Why should you care? In this interview, Vitaly Friedman of Smashing Magazine talks with Phil Hawksworth from Netlify about what it is all about: JAMstack is all about a way of deploying and serving websites that don’t rely on an origin server, they don’t rely on requests hitting an active server all the time.

read more

JavaScript medium.com

Making the case for "functional-ish" JavaScript

Daniel Brain makes the case for “functional-ish” JavaScript… code that utilizes functional programming concepts without going all-in on functional. But functional programming does not need to be all-or-nothing, and in my view it’s better to be a little more pragmatic. That is to say, if you don’t do anything else, try writing code that’s functional-ish. This definitely matches my personal approach. Fully functional still kinda blows my brain, but layering in functional approaches has dramatically improved my code. What about you? Would love to hear some functional or functional-ish “war stories”.

read more

JavaScript jrsinclair.com

Elegant error handling with the JavaScript Either monad

This is an absolute mindbender if you’re not already deeply in the functional world, but this post by James Sinclair is also a readable & fascinating look at how to incrementally move from a try/catch error management approach to a fully functional approach. In this article, we’ll assume you already know about function composition and currying. If you need a minute to brush up on those, that’s totally OK. And a word of warning. If you haven’t come across things like monads before, they might seem really… different. Working with tools like these takes a mind shift. And that can be hard work to start with.

read more

Amila Welihinda amilajack.com

compat-db determines the browser compatibility of ALL browser APIs

This tool aims to go above & beyond what MDN and caniuse have accomplished by automating the generation of the compatibility tables for others to use. Access to the output is programmatic, which scales to more developers via tooling such as static analyzers. Click through for a deep-dive on how it works (spoiler: browserstack is involved) and how Amila optimized its required test executions by 95%.

read more

0:00 / 0:00