🔎 CSS content-visibility: The Web Performance Boost You Might Be Missing

The content-visibility CSS property delays rendering an element, including layout and painting, until it is needed
Web performance optimization can be a real headache. Shaving off milliseconds here and there, minifying everything in sight, and praying to the performance gods.

⏰ Master JavaScript date and time: From Moment.js to Temporal

JavaScript’s Date API has long been a source of frustration for developers due to its historical design flaws, including its:

- Unreliable parsing behavior
- Mutable nature
- Weak time zone support

To overcome these issues and limitations, developers have turned to libraries like Moment.js for more reliable and feature-rich date and time handling. Now, JavaScript has a new built-in solution on the horizon: the Temporal API, which brings a modern and intuitive approach to date and time manipulation.

In this article, we’ll examine JavaScript’s Date API limitations, discussing the strengths and weaknesses of popular libraries like Moment.js, and delving into the Temporal API.

🔥 Lesson 2: Operators and Control Flow in JavaScript!

What will you learn in this lesson?

✅ How arithmetic, logical, and bitwise operators work
✅ How to use conditions (if, switch) and loops (for, while, do...while)
✅ The power of break, continue, and the ternary operator
✅ Common mistakes and best practices to write cleaner code

By the end of this lesson, you'll be able to control program logic and write more efficient code with confidence! 🚀

🔗 Read the article and practice your skills! 💡

#js_course #js_lesson_2

Task 1: Even or odd?

Write a function isEven that takes a number and returns "Even" if the number is even and "Odd" if it is odd.

console.log(isEven(4)); // "Even"
console.log(isEven(7)); // "Odd"

✅ Сhoose the correct option ✅ Or write your version in the comments 📝


1️⃣

function isEven() {
  return num % 2 === 0 ? "Even" : "Odd";
}

2️⃣

function isEven(num) {
  return num % 2 = 0 ? "Even" : "Odd";
}

3️⃣

function isEven(num) {
  return num % 2 === 0 ? "Even" : "Odd";
}

One of Those “Onboarding” UIs, With Anchor Positioning

Anchor positioning lets us attach — or “anchor” — one element to one or more other elements. More than that, it allows us to define how a “target” element (that’s what we call the element we’re attaching to an anchor element) is positioned next to the anchor-positioned element, including fallback positioning in the form of a new @position-try at-rule.

Task 2: Find the maximum of three numbers

Write a function findMax that takes three numbers and returns the largest of them.

console.log(findMax(5, 12, 9)); // 12

✅ Сhoose the correct option ✅ Or write your version in the comments 📝

1️⃣

function findMax(a, b, c) {
  return Math.max(a, b, c);
}

2️⃣

function findMax() {
  return Math.max(a, b, c);
}

3️⃣

function findMax(a, b, c) {
  Math.max(a, b, c);
}

🧐 You probably don’t need http-equiv meta tags

Until recently, I just assumed you could put anything equivalent to an HTTP header in an http-equiv meta tag, and browsers would treat it like the header itself. Maybe you thought the same thing—why wouldn’t you, with a name like that.

But as it turns out, there are actually very few standard values that you can set here. And some values don’t even behave the same way as their header equivalents! What’s going on here and how are we supposed to use this thing?

🧑‍💻 Task 3: Fizz-Buzz

Write a program that prints numbers from 1 to 20, but:

If the number is divisible by 3, print "Fizz"
If the number is divisible by 5, print "Buzz"
If the number is divisible by both 3 and 5, print "FizzBuzz"
Otherwise, just print the number

Example output:

// 1  2  Fizz 4  Buzz Fizz 7 ... FizzBuzz

✅ Сhoose the correct option ✅ Or write your version in the comments 📝

1️⃣

for (let i = 1; i <= 20; i++) {
  if (i % 3 = 0 && i % 5 = 0) {
    console.log("FizzBuzz");
  } else if (i % 3 = 0) {
    console.log("Fizz");
  } else if (i % 5 = 0) {
    console.log("Buzz");
  } else {
    console.log(i);
  }
}

2️⃣

for (let i = 1; i <= 20; i++) {
  if (i % 3 === 0 && i % 5 === 0) {
    console.log("FizzBuzz");
  } else if (i % 3 === 0) {
    console.log("Fizz");
  } else if (i % 5 === 0) {
    console.log("Buzz");
  } else {
    console.log(i);
  }
}

3️⃣

for (let i = 1; i <= 20; i++) {
  if (i % 3 === 0 || i % 5 === 0) {
    console.log("FizzBuzz");
  } else if (i % 3 === 0) {
    console.log("Fizz");
  } else if (i % 5 === 0) {
    console.log("Buzz");
  } else {
    console.log(i);
  }
}

Free Figma Template: Мeterinary Сlinic

🧠 Difficulty: 🥕🥕🥕🥕

#Figma #Template

🧑‍💻 Task 4: Countdown with while

Write a function countdown that takes a number n and prints a countdown to 1 to the console.

countdown(5);
// 5 4 3 2 1

✅ Сhoose the correct option ✅ Or write your version in the comments 📝

1️⃣

function countdown(n) {
  while (n > 0) {
    console.log(n);
  }
}

2️⃣

function countdown(n) {
  while (n > 0) {
    console.log(n);
    n--;
  }
}

3️⃣

function countdown(n) {
  while (n != 0) {
    console.log(n);
    n--;
  }
}

Task 5: Sum of numbers from 1 to N (for loop)

Write a function sumToN that takes a number n and returns the sum of all numbers from 1 to N

Example:

console.log(sumToN(5)); // 15 (1+2+3+4+5)

✅ Сhoose the correct option ✅ Or write your version in the comments 📝

1️⃣

function sumToN(n) {
  let sum = 0;
  for (let i = 1; i <= n; i++) {
    sum += i;
  }
  return sum;
}

2️⃣

function sumToN(n) {
 const sum = 0;
  for (let i = 1; i <= n; i++) {
    sum += i;
  }
  return sum;
}

3️⃣

function sumToN(n) {
  let sum = 0;
  for (let i = 1; i <= n; i++) {
    sum += i;
  }
}

Free Figma Template: Shop

🧠 Difficulty: 🥕🥕🥕

#Figma #Template

📰Tech Weekly Recap🗞️

🚨 Google removed the uBlock Origin extension from the Chrome Web Store.

🚨 Android 15 update for Google Pixel devices introduces a Linux terminal.

🚨 The Blender-animated short film “Flow” won an Oscar.

🚨 A vulnerability in the Python JSON Logger library allowed dependency hijacking when installing from PyPI. The issue has been fixed, but similar vulnerabilities may still exist in other PyPI packages.

🚨 Western Digital released the WD Red Pro 26TB hard drive for $569, making it the company’s highest-capacity NAS drive.

🚨 TSMC proposed that AMD, Nvidia, and other US clients jointly take over Intel’s struggling fabs.

🚨 Mozilla opposes the US DOJ’s antitrust move to ban search traffic payments to Google—an obvious stance, considering Google paid Mozilla ~$450M per year for Firefox search.

🚨 ByteDance open-sourced Lynx, a cross-platform framework for native mobile app development, used in TikTok and TikTok Studio.

🚨 In 2024, Google paid out $11.8M in security bounties for vulnerabilities found in its services.

🚨 Altman and team are pushing to ban DeepSeek, accusing it of stealing US intellectual property and having ties to China, while also calling R1 “too dangerous”—without evidence.