Taha Shashtari

I was working on something that needed connecting nodes with edges. Turns out SVG is perfect for this, one <path> element per edge. 👌

#webdev #javascript #svg

It's interesting that what was considered a *Large* Language Model (LLM) in the past is now considered small.

For example, in 2018 GPT had 117 million parameters, but when GPT-2 was introduced in 2019 with 1.5 billion parameters, that 117 million parameters was considered small.

Example of how early language models worked.

TIL that the origin of language models in AI goes way back to the 1950s, where the first one was based on counting which words appear together.

For example, if you give it "I love []", it will predict "pizza" instead of "broccoli" because "love pizza" appears more often.

TIL about the nullish coalescing assignment operator in JavaScript!

The JavaScript Animation Tool CSS Can't Replace: requestAnimationFrame YouTube video by Taha Shashtari

I've put out a new video explaining what requestAnimationFrame is really for, and you'll learn how to build a smooth follow-the-mouse animation using vanilla JavaScript along the way:
www.youtube.com/watch?v=NJgA...

#javascript #css #webdev #programming

CSS vs JavaScript Animations: Which Is Faster? YouTube video by Taha Shashtari

I always wondered whether CSS animations are really faster than JavaScript.

After a lot of research, it turns out they're not! I shared what I learned in this video:
www.youtube.com/watch?v=NEo6...

I wrote about the named parameters pattern in JavaScript—I think you'll love it 😍
tahazsh.com/blog/named-p...

Strategy pattern is better when done with functions.
tahazsh.com/blog/strateg...

#javascript #typescript #programming #webdev

🚀 Introducing Blendy – a framework-agnostic tool that smoothly transitions any element into any other element with just a few lines of code.

blendy.tahazsh.com

#javascript #WebDev #UI

🚀 Introducing Swapy – a framework-agnostic tool that converts any layout into a drag-to-swap one with just a few lines of code.

swapy.tahazsh.com

My favorite feature in Chrome is taking a screenshot of any element on the page using "Capture node screenshot" in dev tools.

const users = [ { name: "User 1", plan: "free" }, { name: "User 2", plan: "premium" }, { name: "User 3", plan: "free" } ] Object.groupBy(users, ({ plan }) => plan) /* Result is: { free: [ { "name": "User 1", "plan": "free" }, { "name": "User 3", "plan": "free" } ], premium: [ { "name": "User 2", "plan": "premium" } ] } */

Finally we have a simple way to group objects in an array in JavaScript.

Following the previous post, here's a quick way to check if an array has duplicates in JavaScript.

JavaScript tip on how to quickly remove duplicates from an array.

"JavaScript has an array function, reduce, that loops through an array and produces a result of any type—number, string, object, or even array."

Read more: tahazsh.com/blog/javascr...

Learn how to build scroll animations using CSS from scratch Learn how to build scroll animations using CSS from scratch

🚀 Just launched my first course: Mastering CSS Scroll-driven Animations.

csssda.tahazsh.com

This video course covers everything you need to create stunning scroll animations using pure CSS!

Your feedback means a lot to me! 🙏

#css #webdev #html

How to Implement Card Shuffling Interaction in JavaScript Demo and code: https://codepen.io/tahazsh/pen/yLWPNrGVeloxi: https://veloxijs.com/

🎥 Let's learn how to implement card shuffling interaction in JavaScript through a step-by-step video tutorial.
www.youtube.com/watch?v=_b2X...

🔥 JS tip: You can listen for the `transitionend` event on an element to know when the CSS transition has completed.

Using `setTimeout` to wait is not accurate.
Also, there's `animationend` for CSS animations.

Good point! But are they going to support protected fields? That would be very cool. 😄

It might be surprising, but some people actually prefer this “flexibility” and find TypeScript annoying and a waste of time. But in my experience, I can’t imagine building something complex and large without TS; it saved me a lot of time on my last project. But everyone has their own opinions 😄

That looks very active. Thank you!

It's a bummer that Bluesky doesn't let us upload videos. 😔

💡Creating UI interactions (especially complex ones) feels like game development; it involves math, logic, algorithms, and performance.

Looking for active web developers to follow on Bluesky but couldn’t find many. Any suggestions? 🙏

Thank you! 🙏

Totally agree. This man is a genius. Even after 12 years, I’m still amazed by his “Inventing on Principle” talk.

Thank you!

That, and the pipe operator. Once you get used to it in other functional programming languages, you wish every language included it.

Kinda true! 😂

This is my first day of using Bluesky, and I'm already loving it!