# Micro-optimizations #1

# Spread

The love, and arguebly one of my favourites, things of ES6 is the `Spread`-operator. This has made my work so much easier. Also, makes everything look so lovely!

Here comes the question:
> Is the `Spread`-operator faster or slower than using the complete object?

<iframe
style="
  border: none;
  border-radius: 5px;
  box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;
"
src="https://embed.hasty.dev/#eyJnbG9iYWwiOiJjb25zdCBkYXRhID0gWyB7IHRoaW5nOiB0cnVlIH0seyB0aGluZzogZmFsc2UgfSBdIiwidGFza3MiOlt7ImlkIjoiUXBrNDZkMjV6ZGVULVcwaWxTelpVIiwiY29kZSI6ImRhdGEuZmlsdGVyKCh4KSA9PiB4LnRoaW5nKSIsIm9wcyI6MCwicGN0IjowLCJlcnJvciI6IiIsImNvbG9yIjp7Im1vZGVsIjoicmdiIiwiY29sb3IiOls1NSwxOTAsMTA2Ljk5OTk5OTk5OTk5OTk3XSwidmFscGhhIjoxfX0seyJpZCI6ImZRVHJ5NkU2N3hpV2JIRlJIdExjSyIsImNvZGUiOiJkYXRhLmZpbHRlcigoeyB0aGluZyB9KSA9PiB0aGluZykiLCJvcHMiOjAsInBjdCI6MCwiZXJyb3IiOiIiLCJjb2xvciI6eyJtb2RlbCI6InJnYiIsImNvbG9yIjpbNTUsMTkwLDEzOC45NTk4MTQ4NTQ3Mjc4XSwidmFscGhhIjoxfX1dfQ%3D%3D"
width="100%"
height="564"
frameborder="0"
scrolling="no"
loading="lazy"
allowfullscreen
></iframe>

As you can see, using the complete object everytime seems like a better choice. Except for readability, which I do prefer over a such small optimization.

# Numbers

How about numbers? Imagine you're in an interview. The interviewer asks you how to parse an *integer*. You think to yourself:

> Huh? That's a silly question.

Though, is it? Is it really a *silly* question? Well, I don't think it is, there are a magnitude of ways to parse an integer in JavaScript.

Imagine we have this variable

```js
const n = "1";
```

How would you parse `n` into an integer `d`? You could for example do:

```js
const d = parseInt(n);
```

Easy peasy! Well, if I were to be your interviewer, I'd say: 

> Sure, but are there any other ways?

To this, you should not hesitate, but prompt answer:

> Yes! There are many ways. Do you want to see another?

Then you quickly write another way below like so:

```js
const d = Number(n);
```

This would show that you do know some options, but what if you swiftly wrote below the like again, whilst talking

```js
const d = +n;
```

I ofr one, would be super happy and kind of proud, that you'd know at least three options. I wouldn't have to more questions about numbers.

How about 10 options in total? Well, these might still just be some of the options, but heck. It's enough for a proper micro-benchmark.

<iframe
style="
  border: none;
  border-radius: 5px;
  box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;
"
src="https://embed.hasty.dev/#eyJnbG9iYWwiOiJjb25zdCBuID0gXCIxMDFcIiIsInRhc2tzIjpbeyJpZCI6IlFwazQ2ZDI1emRlVC1XMGlsU3paVSIsImNvZGUiOiJjb25zdCBkID0gK24iLCJvcHMiOjAsInBjdCI6MCwiZXJyb3IiOiIiLCJjb2xvciI6eyJtb2RlbCI6InJnYiIsImNvbG9yIjpbNTUsMTkwLDE3OC4zOTE1Njg3MDk4NDk1NF0sInZhbHBoYSI6MX19LHsiaWQiOiJmUVRyeTZFNjd4aVdiSEZSSHRMY0siLCJjb2RlIjoiY29uc3QgZCA9IE51bWJlcihuKSIsIm9wcyI6MCwicGN0IjowLCJlcnJvciI6IiIsImNvbG9yIjp7Im1vZGVsIjoicmdiIiwiY29sb3IiOls1NSwxOTAsMTA2Ljk5OTk5OTk5OTk5OTk3XSwidmFscGhhIjoxfX0seyJpZCI6IlhjNV9nRFlON0ZqdmJsTWVyS18tZiIsImNvZGUiOiJjb25zdCBkID0gbioxIiwib3BzIjowLCJwY3QiOjAsImVycm9yIjoiIiwiY29sb3IiOnsibW9kZWwiOiJyZ2IiLCJjb2xvciI6WzU1LDE5MCwxMTIuOTk4MTYyOTQ0MTEyNjRdLCJ2YWxwaGEiOjF9fSx7ImlkIjoiUmdoNEZNSGxlYnlvZUxaQm9fa1FlIiwiY29kZSI6ImNvbnN0IGQgPSB%2Bfm4iLCJvcHMiOjAsInBjdCI6MCwiZXJyb3IiOiIiLCJjb2xvciI6eyJtb2RlbCI6InJnYiIsImNvbG9yIjpbNTUsMTA2LjcwMTYyOTM2OTEzODA4LDE5MF0sInZhbHBoYSI6MX19LHsiaWQiOiJCZ0t5SG03R0ZqVTBPNE9HOVBjU2ciLCJjb2RlIjoiY29uc3QgZCA9IE1hdGgucm91bmQobikiLCJvcHMiOjAsInBjdCI6MCwiZXJyb3IiOiIiLCJjb2xvciI6eyJtb2RlbCI6InJnYiIsImNvbG9yIjpbNTUsMTkwLDE3MC43NzYwMTM3MTAyMDQ5OF0sInZhbHBoYSI6MX19LHsiaWQiOiI3X2ttRWROeC1hRUtSeTZrYnplWFAiLCJjb2RlIjoiY29uc3QgZCA9IE1hdGguZmxvb3IobikiLCJvcHMiOjAsInBjdCI6MCwiZXJyb3IiOiIiLCJjb2xvciI6eyJtb2RlbCI6InJnYiIsImNvbG9yIjpbNTUsMTgwLjEyOTE1MTM3Mjg2NTE4LDE5MF0sInZhbHBoYSI6MX19LHsiaWQiOiIwUVhjMGpFNjdNM21IU2hsVmVkNTkiLCJjb2RlIjoiY29uc3QgZCA9IE1hdGguY2VpbChuKSIsIm9wcyI6MCwicGN0IjowLCJlcnJvciI6IiIsImNvbG9yIjp7Im1vZGVsIjoicmdiIiwiY29sb3IiOls1NSwxOTAsMTY4LjI5MjUyNjA2NjU3Njc4XSwidmFscGhhIjoxfX0seyJpZCI6IlpjNUo1RGRCSUFfNERXNk1mR3pvZCIsImNvZGUiOiJjb25zdCBkID0gcGFyc2VJbnQobiwgMTApIiwib3BzIjowLCJwY3QiOjAsImVycm9yIjoiIiwiY29sb3IiOnsibW9kZWwiOiJyZ2IiLCJjb2xvciI6WzU1LDE5MCwxNzMuMzc0NjY0OTE2MTQ2ODhdLCJ2YWxwaGEiOjF9fSx7ImlkIjoiVkZWdXFjRkZoY2ZmR0piVmhWcGpIIiwiY29kZSI6ImNvbnN0IGQgPSBwYXJzZUZsb2F0KG4pIiwib3BzIjowLCJwY3QiOjAsImVycm9yIjoiIiwiY29sb3IiOnsibW9kZWwiOiJyZ2IiLCJjb2xvciI6WzU1LDE5MCwxNzIuMjA0NjI0OTg5NTM5MTNdLCJ2YWxwaGEiOjF9fSx7ImlkIjoiZTI5c0R5TnAwODBONmtIX2h2M0lKIiwiY29kZSI6ImNvbnN0IGQgPSBwYXJzZUludChuKSIsIm9wcyI6MCwicGN0IjowLCJlcnJvciI6IiIsImNvbG9yIjp7Im1vZGVsIjoicmdiIiwiY29sb3IiOls1NSwxOTAsMTEwLjY0MzY4NzY0NTYwNzldLCJ2YWxwaGEiOjF9fV19"
width="100%"
height="564"
frameborder="0"
scrolling="no"
loading="lazy"
allowfullscreen
></iframe>

In your journey of bettering yourself in the world of JS, you'd try such a benchmark, just to check which of those **ten** options is the best. Of course, this small website can't give you advice when to use which options in which situation, but it can help you along some of the way, but lowering the guess work.

I found the best options, both for readability and speed, is the `parseInt(n, 10)`, as this actually tells the reader that it'll parse an integer `n` in the `base 10` format.

---

{ Best, [Mads Bram Cordes](https://buymeacoff.ee/mc) }
