ES2009, Threads and the Anagram Challenge

Just in time for your Sunday coffee…

We are reading 👀

What’s new in ES2019

As one of the most popular programming languages and the staple of web development, JavaScript is constantly evolving and with each iteration it gets some fresh internal changes. Let’s check out some of the new proposed features of ES2019 that could soon find a way into our everyday code.

Some links to help you navigate your way:

Running Redux off the main thread

In this article, @darsurma shows us an experiment of running Redux off the main thread. Comlink allows improving the performance taking the Redux process out of the main thread.

Exploring Sets and Maps in JavaScript

The objective of these new constructs is to provide easier and more efficient ways to structure and access data under certain use cases.

Set - The Set object allows you to store unique values of any type.
Map - The Map object allows you to store key-value pairs and remembers the original insertion order of the keys.

We are listening 🎧

Choosing Your JavaScript Framework

What's the most compelling thing to think about when choosing a framework? The 3 hosts, John, Ward, and Dan, walk through some of the reasons for choosing a particular Javascript framework.

alert(‘The tweet of the week 😮’);

A last bite 🥽

Challenge of the week 🕵️‍♀️

Do you know an anagram?

Two strings are anagrams of each other if the letters of one string can be rearranged to form the other string.

Write a function that checks if the provided strings are anagrams of each other; letter casing shouldn’t matter. Also, consider only characters, not spaces or punctuation.

anagram('finder', 'Friend'); // Returns true
anagram('mom', 'dad') // Returns false
anagram('listen', 'Silent') // Returns false

You know how to solve it? Post your answer here.

How did you like today’s email?
love it | meh | hate it

React Hooks, The History of JS and a new Palindrome Challenge

It’s Friday,
Set the volume++++ 🎧, syntonize and enjoy this email.

We are reading 👀

Do React Hooks Replace Redux?

Quick answer: No. Redux gives you code organization and debugging superpowers. React hooks let you use state and React lifecycle features without using class and React component lifecycle methods. Let’s go deeper in this article.

Better branching with Lodash _.cond

Have you already coded 2000 lines of if/then/else with crazy unreadable conditions? Have you updated/debugged/refactored this code to always see a test fail? Have you raged at the moment your nice switch statement didn’t scale because you needed to add if statements in your cases? Well this article and Loadash can help you.

ES modules on Node.js are coming

Yes, modules in Node.js are coming. Supporting ES modules on the server side in Node.js out of the box will allow full-stack developers to naturally write modular, reusable JavaScript for both the client and server.

Improve interface performance with React.memo()

React offers a higher-order component React.memo(). React.memo() is a great tool to gain the benefits of memoization for pure functional components. When applied correctly, it prevents component re-render when the next props equal previous.

We are listening 🎧

The Fundamentals

In this episode of Syntax, Scott and Wes talk about the fundamentals of JavaScript - the set of core skills you should know before branching off into other frameworks, libraries, etc.

Creating JavaScript

A mission to set the course of the world wide web in its early days. 10 days to get it done. The result? An indispensable language that changed everything.

JavaScript was the underdog that won against all odds. Clive Thompson recounts the browser wars and how much the fallout influenced the future of the internet. Charles Severance explains how JavaScript went from a last-minute moonshot to the default web development language.

alert(‘The tweet of the week 👽’);

A last bite 🥽

Challenge of the week 🕵️‍♀️

The famous Palindrome

A palindrome is a word, phrase, number, or other sequence of characters which reads the same backward or forward. The word “palindrome” was first coined by the English playwright Ben Jonson in the 17th century, from the Greek roots palin (“again”) and dromos (“way, direction”). — src. Wikipedia

Algorithm Challenge

Given a string of text, return true or false indicating whether or not the text is a palindrome.

isPalindrome('racecar') // will return true
isPalindrome('motor') // will return false
isPalindrome('Step on no pets') // will return true
isPalindrome('Eva, can I see bees in a cave?') // will return true

Post your answer here and join the discussion about what is the best solution.

How did you like today’s email?
love it | meh | hate it

We are back! HOF, performance and a new weekly challenge!

Hey friends,

We are back!!! Do you know that 100k users learn JavaScript in JsTips each month?👏

We want to continue helping the community and we have a new initiative, but we need your help!

In JsTips Bites we are going to share with you what the team reads, view and listen during the week, summarized with high quality, no ads and with a challenge at the end to make you think smarter 🤯.

We are reading 👀

Higher-order functions in the real world

Higher-order functions are one of the most important features of JavaScript. It’s a function that takes a function as an argument, or returns a function as a result. It’s a fancy-sounding phrase for a simple concept. James explains in this article with clear examples of how you can take advantage of it.

Implementing an efficient LRU cache in JavaScript

Discover how to harness the power of javascript's type arrays to design your very own log-cost pointer system for fixed-capacity data structures.

How To Master Async/Await

Want a good explanation of Async and Await? You can have here with good examples. Async/await is a new way to write asynchronous code. It is built on top of promises, thus, it is also non-blocking. The big difference is that asynchronous code looks and behaves a little more like synchronous code. Don’t want to read? Check this video.

Level up your JavaScript with these algorithms and data structures

An epic recompilation of algorithms and data structures, each one with explanations and links to further readings. If you are looking an excuse to spend your weekend on your computer, take a look here!

New Node.js 12 features will see it disrupt AI, IoT and more surprising areas

A new Node.js version is coming - October 2019 is the planned release date - and the head of the team explains the new features: modules support, threads, private variables and more. Big claps 💪🏼 for the Node.js team.

12 Tips for Improving JavaScript Performance

According to metrics, 40% of visitors will leave your site if the loading takes more than 3 seconds. In this article, Liz wrote about 14 ways to improve your application performance.

We are listening 🎧

The State Machines in React with David Khourshid

David and the podcast panel discusses what a state is in React, he defines it as a state machine and presents his library called Xstate. They also talk about the importance of learning from other industries, Waterfall versus the Agile mindset and finished sharing thoughts about the industry standards.

alert(‘The thread of the week 🎣’);

A last bite 🥽

  • Fractal Animations: Create awesome fractals with this tutorial.

  • Jimp: An image processing library with zero external or native dependencies.

  • Funny: Suncalc: A tiny JavaScript library for calculating sun/moon positions and phases.

  • Back to 2008: jQuery functions to Plain Old JavaScript.

  • Framer Motion: An open source React library to power production-ready animations. 

Challenge of the week 🕵️‍♀️ by @rincodes

Prison Break

A prison can be represented as an array of cells. Each cell contains exactly one prisoner. A 1 represents an unlocked cell and a 0 represents a locked cell.

[1, 1, 0, 0, 0, 1, 0]

Starting from the leftmost cell, you are tasked with seeing how many prisoners you can set free, with a catch. Each time you free a prisoner, the locked cells become unlocked, and the unlocked cells become locked again.

So, if we use the example above:

[1, 1, 0, 0, 0, 1, 0] // You free the prisoner in the 1st cell.
[0, 0, 1, 1, 1, 0, 1] // You free the prisoner in the 3rd cell (2nd one locked).
[1, 1, 0, 0, 0, 1, 0] // You free the prisoner in the 6th cell (3rd, 4th and 5th locked).
[0, 0, 1, 1, 1, 0, 1] // You free the prisoner in the 7th cell - and you are done!

Here, we have freed 4 prisoners in total.
Create a function that, given this unique prison arrangement, returns the number of freed prisoners.

freedPrisoners([1, 1, 0, 0, 0, 1, 0]) ➞ 4
freedPrisoners([1, 1, 1]) ➞ 1
freedPrisoners([0, 0, 0]) ➞ 0
freedPrisoners([0, 1, 1, 1]) ➞ 0

Post your answer here and join the discussion about what is the best solution.

You are going to solve the challenge faster with this playlist 🎧

How did you like today’s email?
love it | meh | hate it

Loading more posts…