DEV Community

Cover image for Write Minimal ES6 Code

Write Minimal ES6 Code

Mursal Furqan Kumbhar on May 29, 2024

In the constantly-changing JavaScript ecosystem, designing simple and efficient code is more important than ever. The release of ES6 introduced a s...
Collapse
 
moopet profile image
Ben Sinclair

I strongly disagree with point 1. It looks way too much like optimising for code size rather than clarity, and it's completely pointless. People who care about saving 7 bytes are going to be shocked at what happens when they run their code through a minimiser, which is what's going to happen during the build, and then those people are going to be shocked at what happens when their script is gzipped and maybe even SPDYd up during transmission over https.

In point 8, I think you should default to using const for the variable. It might seem like it's being re-assigned in the for clause, but it's actually scoped to the enclosed block so defining it as const is usually the safe move.

Collapse
 
dagnelies profile image
Arnaud Dagnelies

From my experience, the usage of !! is much more common than the explicit Boolean(...) cast. Actually, I have never even seen it in practice yet. So from my POV, !! feels familiar and straightforward while the cast feels ...hmm ...very exotic.

Collapse
 
lionelrowe profile image
lionel-rowe • Edited

Really? I use explicit casts all the time as they seem so much clearer in intent. The explicit meaning of !! is "not-not", rather than "convert to boolean". Similarly for Number (or parseInt, parseFloat, etc. depending on use case) vs +... I want to convert to a number, not make the variable positive.

Collapse
 
crisleo94 profile image
Cristhian Reinoso

I have found multiple bugs in react applications because of that !!

Collapse
 
sapegin profile image
Artem Sapegin

Totally agree — shorter isn't always better, and we shouldn't optimize for code brevity but for code clarity. I've collected many more similar examples, though !! is probably the most harmless and commonly used of all.

Collapse
 
lionelrowe profile image
lionel-rowe

Yeah, Airbnb style guide is trash. It also recommends const fn = function longAssDescriptiveName () {} over function normalFunctionName() {} 🤢

Collapse
 
lexlohr profile image
Alex Lohr • Edited

#1 If you don't use terser or another JS minification engine, go ahead, otherwise it makes no difference whatsoever.

#5/6/7 Be aware that proxies and getters will only be called once in destructuring and spreading. If those are used e.g. to provide subscription for reactive behavior (e.g. in Solid.js), this will break your code.

#8 never use forEach like this to copy an array. Use const array = [...items] for a shallow copy to be even faster.

Otherwise, avoid premature optimisations.

Collapse
 
klaymant profile image
Clément

Why age from example 1 is a boolean?

Despite its conciseness I'm not a big fan of the "!!". It's not very explicit about what it does.

Does "less is more" mantra is that relevant in programmation? Do we have to write minimal code no matter the situation? I don't think so.

Collapse
 
efpage profile image
Eckehard

This type of "optimization" is overestimated in most cases. Javascript does a very good job optimizing execution (with some very special exceptions like for/in), and the effort to save some bytes often does not really pay back. On the long run, good readability and a clear structure shouldn't be sacrificed just to minimize the code size.

Collapse
 
plxel profile image
Aleksei Mikhailov

About #1, !! it is just double logical operator, it exists from first version of JS, not related to ES6 at all

Collapse
 
artydev profile image
artydev

Thank you

Collapse
 
imashwani profile image
Ashwani Singh

informative content. Good work!

Collapse
 
nahidulislam profile image
Nahidul Islam

Very informative. Thank you for the post.

Collapse
 
ebcefeti profile image
E. B. Cefeti

I'm not sure what "minimal" is supposed to mean here?

Collapse
 
anthony_alejo_04ce7c390cf profile image
Anthony Alejo

Trying to get better with JS anyone have any tips or recommendations