<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: Priya Pandey</title>
    <description>The latest articles on DEV Community by Priya Pandey (@priya2422).</description>
    <link>https://dev.to/priya2422</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F1344494%2F2641f299-da9b-466f-9925-2ef82eeb7e38.png</url>
      <title>DEV Community: Priya Pandey</title>
      <link>https://dev.to/priya2422</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/priya2422"/>
    <language>en</language>
    <item>
      <title>JavaScript Isn’t Broken — Your Closure Placement Is</title>
      <dc:creator>Priya Pandey</dc:creator>
      <pubDate>Thu, 11 Dec 2025 08:47:12 +0000</pubDate>
      <link>https://dev.to/priya2422/javascript-isnt-broken-your-closure-placement-is-1i21</link>
      <guid>https://dev.to/priya2422/javascript-isnt-broken-your-closure-placement-is-1i21</guid>
      <description>&lt;p&gt;Now and then, JavaScript quietly teaches me something, sitting under the surface. Recently, that lesson came from a tiny custom iterator I was writing just out of curiosity.&lt;/p&gt;

&lt;p&gt;I wasn't trying to solve anything deep.&lt;br&gt;
But while experimenting, I bumped into a pattern that shows up in so many places:&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;Where you put your closure state determines whether your function/object becomes reusable or single-use.&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;It's a deeper concept that affects half the JavaScript patterns we write without even thinking.&lt;/p&gt;

&lt;p&gt;Let me show you how I discovered it.&lt;/p&gt;


&lt;h2&gt;
  
  
  Example 1: A Custom range() Iterator — Not Wrong, Just Interesting
&lt;/h2&gt;

&lt;p&gt;Here's the custom range() iterator I wrote:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;function range(from, to) {
  let nextIndex = from;  // this state lives in the closure of range()

  return {
    next() {
      if (nextIndex &amp;lt;= to) {
        return { value: nextIndex++, done: false };
      }
      return { done: true };
    },
    [Symbol.iterator]() {
      return this;  // this object IS the iterator
    },
  };
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Using it:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;const r = range(1, 4);

for (let x of r) console.log(x);
// -&amp;gt; 1 2 3 4

for (let x of r) console.log(x);
// -&amp;gt; (nothing)
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;And here's the thing:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;This is not a bug.&lt;/li&gt;
&lt;li&gt;This is exactly how generator functions behave.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Generators are intentionally single-use.&lt;br&gt;
Once their internal state moves forward, it stays moved.&lt;br&gt;
My custom iterator behaves the same way.&lt;/p&gt;

&lt;p&gt;So nothing is "wrong".&lt;/p&gt;

&lt;p&gt;But this led me to a deeper realization:&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;The single-use behavior has nothing to do with iterators being tricky.&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;It's simply because:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;The state (nextIndex) lives in the outer closure&lt;/li&gt;
&lt;li&gt;And [Symbol.iterator] returns the same object every time&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Which means the iterator cannot restart - the internal state never resets.&lt;/p&gt;

&lt;p&gt;This is where the real pattern shows up.&lt;/p&gt;


&lt;h2&gt;
  
  
  If You Want a Reusable Iterable…
&lt;/h2&gt;

&lt;p&gt;…you only need to change where the state lives:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;function range(from, to) {
  return {
    [Symbol.iterator]() {
      let nextIndex = from;  // fresh state per iterator instance
      return {
        next() {
          if (nextIndex &amp;lt;= to) {
            return { value: nextIndex++, done: false };
          }
          return { done: true };
        },
      };
    },
  };
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Now:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;for (let x of r) console.log(x); // 1 2 3 4
for (let x of r) console.log(x); // 1 2 3 4   (restarts)
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Fresh iterator -&amp;gt; fresh nextIndex -&amp;gt; reusable iterable.&lt;/p&gt;

&lt;p&gt;And that's when I realized:&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;This isn't about iterators.&lt;br&gt;
It's about closure state and how we structure our functions.&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;To test the theory, I tried something completely different - a pipe() function.&lt;/p&gt;

&lt;p&gt;And it exposed the same pattern.&lt;/p&gt;




&lt;h2&gt;
  
  
  Example 2: A Pipe Function That Accidentally Became Single-Use
&lt;/h2&gt;

&lt;p&gt;If you haven't used pipe() before:&lt;br&gt;
It's a small functional helper that takes a list of functions and runs them in sequence:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;pipe([f1, f2, f3])(value)
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;is basically:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;f3(f2(f1(value)))
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Here's the first version I wrote:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;function pipe(funcs) {
  let i = 0; // state stored OUTSIDE merged()

  return function merged(...args) {
    if (funcs.length === 0) return args[0];

    const out = funcs[i](...args);

    if (i === funcs.length - 1) {
      return out;
    }

    i++;
    return merged(out);
  };
}

&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Usage:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;const fn = pipe([x =&amp;gt; x * 2, x =&amp;gt; x + 3]);

console.log(fn(5));  // 13
console.log(fn(5));  // 8 (state leaked across calls)
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;And then I laughed because this is the same pattern as the iterator example:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;'i' lives in the outer closure&lt;/li&gt;
&lt;li&gt;The returned function shares that 'i' across invocations&lt;/li&gt;
&lt;li&gt;Which means the whole pipeline is single-use&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Exactly like the iterator.&lt;/p&gt;




&lt;h2&gt;
  
  
  Fixing It (Again) By Moving State Inside
&lt;/h2&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;function pipe(funcs) {
  return function merged(...args) {
    function helper(i, val) {
      if (i &amp;gt;= funcs.length) return val;
      return helper(i + 1, funcs[i](val));
    }
    return helper(0, ...args);  // fresh state per call
  };
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Now:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;fn(5); // 13
fn(5); // 13

&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;






&lt;h2&gt;
  
  
  The Actual Pattern
&lt;/h2&gt;

&lt;p&gt;After seeing this in both examples, the pattern became very clear:&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;If your state lives in the outer closure, you create a single-use function/object.&lt;br&gt;
If your state is created inside a nested function or factory, you get a reusable function/object.&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;This applies to:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;iterators&lt;/li&gt;
&lt;li&gt;generators&lt;/li&gt;
&lt;li&gt;pipes&lt;/li&gt;
&lt;li&gt;debounce/throttle&lt;/li&gt;
&lt;li&gt;decorators&lt;/li&gt;
&lt;li&gt;memoization&lt;/li&gt;
&lt;li&gt;middleware&lt;/li&gt;
&lt;li&gt;event callback wrappers&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Basically, half of JavaScript.&lt;/p&gt;




&lt;h2&gt;
  
  
  What This Taught Me
&lt;/h2&gt;

&lt;p&gt;I used to look at nested functions and think:&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;"Why do people put functions inside functions? Just flatten it!"&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;Now I understand why:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Nested functions give you fresh closure state&lt;/li&gt;
&lt;li&gt;Fresh state gives you reusable behavior&lt;/li&gt;
&lt;li&gt;Outer closure state gives you single-use behavior&lt;/li&gt;
&lt;/ul&gt;




&lt;h2&gt;
  
  
  What About You?
&lt;/h2&gt;

&lt;p&gt;Have you ever written something that mysteriously worked only once?&lt;br&gt;
Or something that behaved "weirdly" because of closure state placement?&lt;/p&gt;

&lt;p&gt;I'd love to hear other examples - this pattern is everywhere once you learn to see it.&lt;/p&gt;

</description>
      <category>javascript</category>
      <category>webdev</category>
      <category>programming</category>
      <category>tutorial</category>
    </item>
    <item>
      <title>Memoization in JavaScript: How Not to Be Dumb About It</title>
      <dc:creator>Priya Pandey</dc:creator>
      <pubDate>Sun, 23 Feb 2025 13:59:09 +0000</pubDate>
      <link>https://dev.to/priya2422/memoization-in-javascript-how-not-to-be-dumb-about-it-p3m</link>
      <guid>https://dev.to/priya2422/memoization-in-javascript-how-not-to-be-dumb-about-it-p3m</guid>
      <description>&lt;p&gt;Have you ever met someone who asks the same question repeatedly even though they already got the answer? Yeah, don’t let your JavaScript functions be that person.&lt;/p&gt;

&lt;p&gt;Memoization is a fancy saying: “Remember the answer so you don’t have to redo the work.” It’s one of those concepts that sounds simple but can go hilariously wrong if not done right.&lt;/p&gt;

&lt;p&gt;In this article, we’ll explore:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;How memoization works (without boring you to death).&lt;/li&gt;
&lt;li&gt;The different ways to implement it (closures vs function properties).&lt;/li&gt;
&lt;li&gt;The biggest mistakes people make (like using bad keys).
By the end, you’ll have a bulletproof memoization function that doesn’t make dumb mistakes. Let’s go!&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;So, why do we even need memorization?&lt;/p&gt;

&lt;p&gt;Let’s say you have a super slow function — something like this:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;function slowSquare(n) {
    console.log(`Calculating square of ${n}... ⏳`);
    // Simulating a slow computation
    for (let i = 0; i &amp;lt; 1e9; i++) {}  
    return n * n;
}

console.log(slowSquare(5));  
console.log(slowSquare(5));
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  Memoization Without Closures? Meet Function Properties!
&lt;/h2&gt;

&lt;p&gt;So, we know closures work great for memoization, but did you know you can store cache directly on the function itself? Yep, functions in JavaScript are objects, meaning they can hold properties like an object does.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;function memoizedSquare(n) {
    if (!memoizedSquare.cache) {
        memoizedSquare.cache = {};  // Initialize cache on first run
    }

    if (memoizedSquare.cache[n]) {
        console.log("Memoized call!");
        return memoizedSquare.cache[n];
    }

    console.log("New call!");
    return (memoizedSquare.cache[n] = n * n);
}

console.log(memoizedSquare(4));  // New call!
console.log(memoizedSquare(4));  // Memoized call! 
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;Why does this work?&lt;/strong&gt;&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;Every function in JavaScript is an object, so we can store a cache inside it.&lt;/li&gt;
&lt;li&gt;The cache is persistent across function calls, just like in closures.&lt;/li&gt;
&lt;li&gt;Less memory overhead compared to returning a whole new function.&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;&lt;strong&gt;Why you should avoid this?&lt;/strong&gt;&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;If you need to memoize multiple functions, they will each need their own cache property.&lt;/li&gt;
&lt;li&gt;Function properties can be accidentally modified or deleted, leading to unpredictable behavior.&lt;/li&gt;
&lt;li&gt;Another issue is this memory can’t be shared if you are extending the function if that is what you want. Let’s get deeper into that in next method.&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;&lt;strong&gt;Prototype Pollution: A Dangerous Mistake&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Some developers might think, "Hey, let's store cache in the function prototype instead!" but this is a disaster waiting to happen.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;function memoizedSquare(n) {
    if (!memoizedSquare.prototype.cache) {
        memoizedSquare.prototype.cache = {};  // Initialize cache on first run
    }

    if (memoizedSquare.prototype.cache[n]) {
        console.log("Memoized call!");
        return memoizedSquare.prototype.cache[n];
    }

    console.log("New call!");
    return (memoizedSquare.prototype.cache[n] = n * n);
}

console.log(memoizedSquare(5));  // New call!
console.log(memoizedSquare(5));  // Memoized call! 
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;Why is this very very bad?&lt;/strong&gt;&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;Pollutes all instances of the function — every function that uses the prototype will share the same cache by that I mean the functions that extend the above function will have access to the cache.&lt;/li&gt;
&lt;li&gt;Can be accidentally modified or overwritten by other parts of the code or even other functions extending them.&lt;/li&gt;
&lt;li&gt;Prototype pollution exploits exist, where malicious code can hijack properties stored in the prototype.&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;&lt;strong&gt;Moral of the story?&lt;/strong&gt; Never store caches in the prototype! Use function properties only when necessary and be mindful of scope.&lt;/p&gt;

&lt;p&gt;Now that we’ve covered this unusual method, let’s move on to the classic closures approach in the next section!&lt;/p&gt;

&lt;h2&gt;
  
  
  The Classic Approach: Closures for Memoization
&lt;/h2&gt;

&lt;p&gt;If you’ve worked with memoization before, this is probably the method you’ve seen. Closures allow us to keep a cache inside a function without polluting the global scope or modifying function properties.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;function square(val){
  return val*val;
}
function memoizedFn(fn) {
    let cache = new Map();  // using Map DS as its faster

    return function(arg) {
        if (cache.has(arg)) {
            console.log("Memoized call!");
            return cache.get(arg);
        }

        console.log("New call!");
        const value = fn(arg);
        return cache.set(arg,value);
        return value;
    };
}

const betterSquare = memoizedFn(square);

console.log(betterSquare(5));  // New call!
console.log(betterSquare(5));  // Memoized call!
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;Why Is This The Standard Approach?&lt;/strong&gt;&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;No global variables — cache is fully enclosed inside the function.&lt;/li&gt;
&lt;li&gt;Safe from modification — unlike function properties, this cache isn’t exposed.&lt;/li&gt;
&lt;li&gt;Ideal for multiple instances — you can create multiple memoized functions without interference.&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;&lt;strong&gt;Downsides of Closures&lt;/strong&gt;&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;Function Wrapping Required — you must return a new function every time.&lt;/li&gt;
&lt;li&gt;Memory Growth — The cache can grow indefinitely if not handled properly. Cache eviction strategies help tackle this, but let’s keep that discussion for another day—I'm yet to explore that myself! 😂&lt;/li&gt;
&lt;/ol&gt;

&lt;h2&gt;
  
  
  Bonus: Handling Key Generation
&lt;/h2&gt;

&lt;p&gt;So far, we’ve only used numbers as keys, but what if the function takes other values like strings boolean?&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;function memoizedFn(fn) {
    let cache = new Map(); 

    return function(arg) {
        if (cache.has(arg)) {
            console.log("Memoized call!");
            return cache.get(arg);
        }

        console.log("New call!");
        const value = fn(arg);
        return cache.set(arg,value);
        return value;
    };
}

const betterFn = memoizedFn(fn);
console.log(betterFn(1));  // New call!
console.log(betterFn('1'));  // Memoized call!
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Oh no! Those are two different values. You might have heard that before using a value as a key they converted it into strings. That’s exactly what happened here.&lt;/p&gt;

&lt;p&gt;What is the solution? One of the solutions here is to generate key with the typeof that value. Something like this:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;function generateKey(key){
  return key+`${typeof key}`;
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;In the above case, our keys would look something like this:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;cache = {
  '1number': "something",
  '1string': "something",
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Hold it isn’t over. What if we have multiple arguments? We still have our protector rest operator and we will be using the apply method to give our function its context and our arguments.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;function sum(a,b,c){
  return a+b+c;
}
function generateKey(key){
  const cacheKey=key.map(k=&amp;gt; (k+`${typeof k}`));
  return cacheKey.join("_");
}
function memoizedFn(fn) {
    let cache = new Map(); 

    return function(...arg) {
        const key=generateKey(arg);
        if (cache.has(key)) {
            console.log("Memoized call!");
            return cache.get(key);
        }

        console.log("New call!");
        const value = fn.apply(this, arg);
        cache.set(key,value);
        return value;
    };
}

const betterSum = memoizedFn(sum);
console.log(betterSum(1,3,5));  // New call!
console.log(betterSum(1,3,5));  // Memoized call!
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;blockquote&gt;
&lt;p&gt;Memoization is a powerful technique that boosts performance by caching previously computed results. But the way you implement it depends on your use case!&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;The above memoization function can be very complex and can be modified to cover various use cases and edge cases. I have provided a basic generalized function to help you guys learn the concept. You can extend to generate your versions of memoized function and yes do share with me so that I can learn with you.&lt;/p&gt;

</description>
    </item>
    <item>
      <title>Debouncing vs. Throttling: Don't Let Your Code Misbehave! 🍕🚀</title>
      <dc:creator>Priya Pandey</dc:creator>
      <pubDate>Mon, 10 Feb 2025 20:57:43 +0000</pubDate>
      <link>https://dev.to/priya2422/debouncing-vs-throttling-dont-let-your-code-misbehave-4j73</link>
      <guid>https://dev.to/priya2422/debouncing-vs-throttling-dont-let-your-code-misbehave-4j73</guid>
      <description>&lt;p&gt;Have you ever clicked a button multiple times and suddenly realized your app glitched or made too many API calls? Maybe you've typed in a search bar, and it kept sending requests after every letter?&lt;/p&gt;

&lt;p&gt;That’s when debouncing and throttling come to the rescue! 🚀&lt;/p&gt;

&lt;p&gt;These two JavaScript techniques control how frequently your function executes, making your app faster, smoother, and bug-free. Today, we’ll break them down in a fun, pizza-themed way—because who doesn’t love pizza? 🍕🔥&lt;/p&gt;

&lt;h2&gt;
  
  
  🍕 Debouncing: "Ek Baar Bolna, Baar Baar Nahi!" (Say it once, not again and again!)
&lt;/h2&gt;

&lt;p&gt;Imagine you're at a pizza restaurant, and you have a habit of changing your order every second:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;"Ek Margherita dedo!"(Give me one Margherita!)&lt;/li&gt;
&lt;li&gt;"Nahi nahi, ek Pepperoni dedo!" (No no, give me one Pepperoni!)&lt;/li&gt;
&lt;li&gt;"Wait, ek Farmhouse dedo!"(Wait, give me one Farmhouse!)&lt;/li&gt;
&lt;li&gt;"Arey, nahi! Cheesy Burst chahiye!"(Oh no! I want Cheesy Burst!)&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;What happens? 🤦‍♂️&lt;br&gt;
The waiter gets confused and doesn't place the order until you're finally done deciding. He waits for you to stop changing your mind before sending the order to the kitchen.&lt;/p&gt;

&lt;p&gt;This is Debouncing. 💡&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;function debounce(orderFunction, delay) {
  let timer;
  return function () {
    clearTimeout(timer);
    timer = setTimeout(orderFunction, delay); // Execute after delay
  };
}
function acceptOrder() {
  console.log("Pizza order accepted! 🍕");
}

const orderButton = document.getElementById("orderButton");
orderButton.addEventListener("click", debounce(acceptOrder, 3000));
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;blockquote&gt;
&lt;p&gt;Don't ask how timer is still available for our order. Please have a proper closure with &lt;strong&gt;THE CLOSURE&lt;/strong&gt; from the one and only &lt;a href="https://youtu.be/qikxEIxsXco?si=B6Sx-v2OOYq61qrp" rel="noopener noreferrer"&gt;Akshay Saini&lt;/a&gt;&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;📝 What Happens?&lt;/p&gt;

&lt;p&gt;If you click multiple times within 3 seconds, the function won’t execute.&lt;br&gt;
It only executes after you stop clicking for 3 seconds.&lt;br&gt;
✅ Perfect for search bars, form submissions, or anything that shouldn’t trigger too frequently!&lt;/p&gt;


&lt;h2&gt;
  
  
  ⏳ Throttling: "Limit Cross Mat Karo Bhai!"(Don't Cross the Limit, Bro!)
&lt;/h2&gt;

&lt;p&gt;Now imagine another scenario:&lt;/p&gt;

&lt;p&gt;You’re super hungry and start shouting at the waiter every second:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;"Bhai, pizza lao!"(Bro, bring the pizza!)&lt;/li&gt;
&lt;li&gt;"Bhai, pizza lao!"(Bro, bring the pizza!)&lt;/li&gt;
&lt;li&gt;"Bhai, pizza lao!"(Bro, bring the pizza!)&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;The waiter finally loses patience and tells you:&lt;br&gt;
👉 "Aap jitni baar bhi bolo, main sirf har 5 second me ek baar order loonga!"(No matter how many times you ask, I'll only take one order every 5 seconds!)&lt;/p&gt;

&lt;p&gt;This is Throttling—even if you keep spamming the button, the function will only execute once in a fixed time interval.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;function throttle(orderFunction, duration) {
  let lastExecutionTime = 0;
  return function () {
    const currentTime = Date.now();
    if (currentTime - lastExecutionTime &amp;gt;= duration) {
      orderFunction();
      lastExecutionTime = currentTime;
    }
  };
}
function acceptOrder() {
  console.log("Pizza order placed! 🍕");
}

const orderButton = document.getElementById("orderButton");
orderButton.addEventListener("click", throttle(acceptOrder, 5000));
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;📝 What Happens?&lt;/p&gt;

&lt;p&gt;If you click 10 times within 5 seconds, the function runs only ONCE.&lt;br&gt;
After 5 seconds, the function runs again if clicked.&lt;br&gt;
✅ Perfect for API rate limiting, scrolling, or any function that should execute at fixed intervals!&lt;/p&gt;



&lt;p&gt;For our readers who want more like our pizza customers.&lt;/p&gt;

&lt;p&gt;👉 That’s what our basic debounce function did. But now, introducing Debounce 2.0 – The Advanced Edition! 🚀&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;function debounce(func, delay) {
  let timer;
  return function (...args) {
    clearTimeout(timer);
    timer = setTimeout(() =&amp;gt; func.apply(this, args), delay);
  };
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;😒Don't fuss I have Throttle SUPERCHARGED Version as well.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;function throttle(func, limit) {
  let lastCall = 0;
  return function (...args) {
    const now = Date.now();
    if (now - lastCall &amp;gt;= limit) {
      func.apply(this, args);
      lastCall = now;
    }
  };
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Try it out and save your CPU from unnecessary drama.😮‍💨&lt;/p&gt;

</description>
      <category>react</category>
      <category>frontend</category>
      <category>javascript</category>
      <category>performance</category>
    </item>
    <item>
      <title>The Talk Show: Where Speech Meets Spectacle</title>
      <dc:creator>Priya Pandey</dc:creator>
      <pubDate>Sun, 24 Nov 2024 17:36:47 +0000</pubDate>
      <link>https://dev.to/priya2422/the-talk-show-where-speech-meets-spectacle-386n</link>
      <guid>https://dev.to/priya2422/the-talk-show-where-speech-meets-spectacle-386n</guid>
      <description>&lt;p&gt;&lt;em&gt;This is a submission for the &lt;a href="https://dev.to/challenges/assemblyai"&gt;AssemblyAI Challenge &lt;/a&gt;: Sophisticated Speech-to-Text.&lt;/em&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  What I Built
&lt;/h2&gt;

&lt;p&gt;I built a Conversation Visualizer- a fun and interactive way to bring conversations to life!&lt;/p&gt;

&lt;p&gt;This project animates real-time dialogues by transforming speakers into expressive avatars that react to the conversation visually. Each avatar represents a participant, showcasing their emotions and activity dynamically. Whether it’s a heated debate, a casual chat, or a storytelling session, this tool captures and visualizes the essence of the conversation in an engaging and visually appealing way.&lt;/p&gt;

&lt;h2&gt;
  
  
  Demo
&lt;/h2&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Ff67cc9ski95ezqbsdsvr.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Ff67cc9ski95ezqbsdsvr.png" alt="Audio Input File" width="800" height="364"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fgvbtfgt1hav36do18tnv.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fgvbtfgt1hav36do18tnv.png" alt="Coversational Story" width="800" height="364"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://assembly-api-frontend.onrender.com/" rel="noopener noreferrer"&gt;Website Demo&lt;/a&gt;&lt;br&gt;
&lt;strong&gt;You can try with these sample audios.&lt;/strong&gt;&lt;br&gt;
&lt;a href="https://drive.google.com/file/d/1CvU3bYICkGO_BhbVsudLXi0Sp3fmajIw/view?usp=sharing" rel="noopener noreferrer"&gt;Audio Sample 1&lt;/a&gt;&lt;br&gt;
&lt;a href="https://drive.google.com/file/d/1fz2825XfU9Flm36_hg3DNfcTfFhTWLJs/view?usp=sharing" rel="noopener noreferrer"&gt;Audio Sample 2&lt;/a&gt; &lt;br&gt;
&lt;a href="https://drive.google.com/file/d/13iThCCg6mvsRt_bP-VPoc0UDK0hjGCEv/view?usp=sharing" rel="noopener noreferrer"&gt;Audio Sample 3&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://github.com/tinkerish/assembly_api_backend" rel="noopener noreferrer"&gt;Backend Code&lt;/a&gt;&lt;br&gt;
&lt;a href="https://github.com/tinkerish/assembly_api_frontend" rel="noopener noreferrer"&gt;Frontend Code&lt;/a&gt;&lt;br&gt;
&lt;a href="https://www.awesomescreenshot.com/video/33950190?key=6f54a7e1399ba2e4f7126a5ad45ca05a" rel="noopener noreferrer"&gt;Video Demo&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Journey
&lt;/h2&gt;

&lt;p&gt;Universal-2, AssemblyAI’s Speech-to-Text model, was instrumental in building my Conversation Visualizer. It provided speaker identification and insightful summaries to enrich the experience.&lt;/p&gt;

&lt;h3&gt;
  
  
  How I Used AssemblyAI:
&lt;/h3&gt;

&lt;p&gt;&lt;strong&gt;1. Speaker Diarization:&lt;/strong&gt; This feature identified individual speakers, segmenting the audio into distinct utterances. These utterances were then mapped to animated avatars, creating an engaging and real-time dialogue visualization.&lt;br&gt;
&lt;strong&gt;2. Summarization:&lt;/strong&gt; I utilized the "catchy" summary model with the headline type to generate a concise and captivating conversation overview. This summary acts as a quick takeaway for viewers, encapsulating the essence of the dialogue in a single, impactful headline.&lt;br&gt;
&lt;strong&gt;3. Seamless Integration&lt;/strong&gt;: By combining diarization with summarization, I provided users not only with a dynamic, visual representation of conversations but also a high-level overview for quick context, making the tool versatile for various use cases like podcasts, meetings, or storytelling.&lt;/p&gt;

&lt;p&gt;The combination of AssemblyAI's diarization and summarization made it possible to turn ordinary audio conversations into visually compelling and insightful narratives, enhancing functionality and creativity.&lt;/p&gt;

</description>
      <category>devchallenge</category>
      <category>assemblyaichallenge</category>
      <category>ai</category>
      <category>api</category>
    </item>
    <item>
      <title>Navigating the Directed Maze: Finding the Minimum Spanning Tree</title>
      <dc:creator>Priya Pandey</dc:creator>
      <pubDate>Tue, 05 Nov 2024 08:45:46 +0000</pubDate>
      <link>https://dev.to/priya2422/navigating-the-directed-maze-finding-the-minimum-spanning-tree-2je4</link>
      <guid>https://dev.to/priya2422/navigating-the-directed-maze-finding-the-minimum-spanning-tree-2je4</guid>
      <description>&lt;p&gt;When we think of graphs, we often picture the vast and intricate networks connecting cities, data points, or even social interactions. But what happens when we add direction to our edges? Enter directed graphs, where the edges have a one-way street feel. &lt;/p&gt;

&lt;h5&gt;
  
  
  &lt;strong&gt;The Dilemma: Can We Have an MST in Directed Graphs?&lt;/strong&gt;
&lt;/h5&gt;

&lt;blockquote&gt;
&lt;p&gt;(I know, I know we already have famous algorithms for the same but let's not go that way and explore other options too😁)&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;The traditional MST focuses on undirected graphs, ensuring that every node is reachable from every other node. However, in directed graphs, we face a fork in the road. Directed graphs can be categorized into two types:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;&lt;p&gt;&lt;strong&gt;Strongly Connected Graphs&lt;/strong&gt;: Here, every node can reach every other node. No problem—finding an MST is straightforward!&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;strong&gt;Weakly Connected Graphs&lt;/strong&gt;: In this scenario, while the graph is connected when we ignore direction, not all nodes can reach each other directly. This raises a question: How do we find an MST when we have multiple starting points?&lt;/p&gt;&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;In weakly connected graphs, we must begin our journey from a root node that can reach all other nodes. But wait—there might be several potential roots that satisfy this condition! Our goal is to determine the minimum weight spanning tree, so we need a strategy to compare these roots and pick the one that gives us the least weight.&lt;/p&gt;

&lt;p&gt;My solution works for strongly connected ones but for weakly connected ones we have to modify this solution.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight cpp"&gt;&lt;code&gt;&lt;span class="cp"&gt;#include&lt;/span&gt; &lt;span class="cpf"&gt;&amp;lt;iostream&amp;gt;&lt;/span&gt;&lt;span class="cp"&gt;
#include&lt;/span&gt; &lt;span class="cpf"&gt;&amp;lt;bits/stdc++.h&amp;gt;&lt;/span&gt;&lt;span class="cp"&gt;
&lt;/span&gt;&lt;span class="k"&gt;using&lt;/span&gt; &lt;span class="k"&gt;namespace&lt;/span&gt; &lt;span class="n"&gt;std&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;

&lt;span class="kt"&gt;int&lt;/span&gt; &lt;span class="nf"&gt;spanningTreeForDirectedGraphs&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="kt"&gt;int&lt;/span&gt; &lt;span class="n"&gt;V&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="n"&gt;vector&lt;/span&gt;&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="n"&gt;vector&lt;/span&gt;&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="kt"&gt;int&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&amp;gt;&lt;/span&gt; &lt;span class="n"&gt;adj&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="kt"&gt;int&lt;/span&gt; &lt;span class="n"&gt;e&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="n"&gt;vector&lt;/span&gt;&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="kt"&gt;int&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&lt;/span&gt; &lt;span class="n"&gt;weight&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="n"&gt;V&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="n"&gt;INT_MAX&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
    &lt;span class="n"&gt;vector&lt;/span&gt;&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="n"&gt;vector&lt;/span&gt;&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="kt"&gt;int&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&amp;gt;&lt;/span&gt; &lt;span class="n"&gt;mat&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="n"&gt;V&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="n"&gt;vector&lt;/span&gt;&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="kt"&gt;int&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="n"&gt;V&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="o"&gt;-&lt;/span&gt;&lt;span class="mi"&gt;1&lt;/span&gt;&lt;span class="p"&gt;));&lt;/span&gt;

    &lt;span class="c1"&gt;// Construct the adjacency matrix&lt;/span&gt;
    &lt;span class="k"&gt;for&lt;/span&gt; &lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="kt"&gt;int&lt;/span&gt; &lt;span class="n"&gt;i&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="mi"&gt;0&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt; &lt;span class="n"&gt;i&lt;/span&gt; &lt;span class="o"&gt;&amp;lt;&lt;/span&gt; &lt;span class="n"&gt;e&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt; &lt;span class="n"&gt;i&lt;/span&gt;&lt;span class="o"&gt;++&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
        &lt;span class="n"&gt;mat&lt;/span&gt;&lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="n"&gt;adj&lt;/span&gt;&lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="n"&gt;i&lt;/span&gt;&lt;span class="p"&gt;][&lt;/span&gt;&lt;span class="mi"&gt;0&lt;/span&gt;&lt;span class="p"&gt;]][&lt;/span&gt;&lt;span class="n"&gt;adj&lt;/span&gt;&lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="n"&gt;i&lt;/span&gt;&lt;span class="p"&gt;][&lt;/span&gt;&lt;span class="mi"&gt;1&lt;/span&gt;&lt;span class="p"&gt;]]&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="n"&gt;adj&lt;/span&gt;&lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="n"&gt;i&lt;/span&gt;&lt;span class="p"&gt;][&lt;/span&gt;&lt;span class="mi"&gt;2&lt;/span&gt;&lt;span class="p"&gt;];&lt;/span&gt;
    &lt;span class="p"&gt;}&lt;/span&gt;

    &lt;span class="n"&gt;priority_queue&lt;/span&gt;&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="n"&gt;pair&lt;/span&gt;&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="kt"&gt;int&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="kt"&gt;int&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="n"&gt;vector&lt;/span&gt;&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="n"&gt;pair&lt;/span&gt;&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="kt"&gt;int&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="kt"&gt;int&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&amp;gt;&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="n"&gt;greater&lt;/span&gt;&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="n"&gt;pair&lt;/span&gt;&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="kt"&gt;int&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="kt"&gt;int&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&amp;gt;&amp;gt;&lt;/span&gt; &lt;span class="n"&gt;q&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
    &lt;span class="c1"&gt;// Assuming source node 0 if not given&lt;/span&gt;
    &lt;span class="n"&gt;q&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="n"&gt;push&lt;/span&gt;&lt;span class="p"&gt;({&lt;/span&gt;&lt;span class="mi"&gt;0&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;0&lt;/span&gt;&lt;span class="p"&gt;});&lt;/span&gt;
    &lt;span class="n"&gt;weight&lt;/span&gt;&lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="mi"&gt;0&lt;/span&gt;&lt;span class="p"&gt;]&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="mi"&gt;0&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
    &lt;span class="kt"&gt;int&lt;/span&gt; &lt;span class="n"&gt;ans&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="mi"&gt;0&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;

    &lt;span class="k"&gt;while&lt;/span&gt; &lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="o"&gt;!&lt;/span&gt;&lt;span class="n"&gt;q&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="n"&gt;empty&lt;/span&gt;&lt;span class="p"&gt;())&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
        &lt;span class="kt"&gt;int&lt;/span&gt; &lt;span class="n"&gt;node&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="n"&gt;q&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="n"&gt;top&lt;/span&gt;&lt;span class="p"&gt;().&lt;/span&gt;&lt;span class="n"&gt;second&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
        &lt;span class="kt"&gt;int&lt;/span&gt; &lt;span class="n"&gt;dis&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="n"&gt;q&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="n"&gt;top&lt;/span&gt;&lt;span class="p"&gt;().&lt;/span&gt;&lt;span class="n"&gt;first&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
        &lt;span class="n"&gt;q&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="n"&gt;pop&lt;/span&gt;&lt;span class="p"&gt;();&lt;/span&gt;

        &lt;span class="k"&gt;for&lt;/span&gt; &lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="kt"&gt;int&lt;/span&gt; &lt;span class="n"&gt;i&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="mi"&gt;0&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt; &lt;span class="n"&gt;i&lt;/span&gt; &lt;span class="o"&gt;&amp;lt;&lt;/span&gt; &lt;span class="n"&gt;V&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt; &lt;span class="n"&gt;i&lt;/span&gt;&lt;span class="o"&gt;++&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
            &lt;span class="kt"&gt;int&lt;/span&gt; &lt;span class="n"&gt;wei&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="n"&gt;mat&lt;/span&gt;&lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="n"&gt;node&lt;/span&gt;&lt;span class="p"&gt;][&lt;/span&gt;&lt;span class="n"&gt;i&lt;/span&gt;&lt;span class="p"&gt;];&lt;/span&gt;
            &lt;span class="k"&gt;if&lt;/span&gt; &lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="n"&gt;weight&lt;/span&gt;&lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="n"&gt;i&lt;/span&gt;&lt;span class="p"&gt;]&lt;/span&gt; &lt;span class="o"&gt;&amp;gt;&lt;/span&gt; &lt;span class="n"&gt;wei&lt;/span&gt; &lt;span class="o"&gt;&amp;amp;&amp;amp;&lt;/span&gt; &lt;span class="n"&gt;wei&lt;/span&gt; &lt;span class="o"&gt;!=&lt;/span&gt; &lt;span class="o"&gt;-&lt;/span&gt;&lt;span class="mi"&gt;1&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
                &lt;span class="n"&gt;q&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="n"&gt;push&lt;/span&gt;&lt;span class="p"&gt;({&lt;/span&gt;&lt;span class="n"&gt;wei&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="n"&gt;i&lt;/span&gt;&lt;span class="p"&gt;});&lt;/span&gt;
                &lt;span class="k"&gt;if&lt;/span&gt; &lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="n"&gt;weight&lt;/span&gt;&lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="n"&gt;i&lt;/span&gt;&lt;span class="p"&gt;]&lt;/span&gt; &lt;span class="o"&gt;!=&lt;/span&gt; &lt;span class="n"&gt;INT_MAX&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
                    &lt;span class="n"&gt;ans&lt;/span&gt; &lt;span class="o"&gt;-=&lt;/span&gt; &lt;span class="n"&gt;weight&lt;/span&gt;&lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="n"&gt;i&lt;/span&gt;&lt;span class="p"&gt;];&lt;/span&gt;
                &lt;span class="p"&gt;}&lt;/span&gt;
                &lt;span class="n"&gt;weight&lt;/span&gt;&lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="n"&gt;i&lt;/span&gt;&lt;span class="p"&gt;]&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="n"&gt;wei&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
                &lt;span class="n"&gt;ans&lt;/span&gt; &lt;span class="o"&gt;+=&lt;/span&gt; &lt;span class="n"&gt;wei&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
            &lt;span class="p"&gt;}&lt;/span&gt;
        &lt;span class="p"&gt;}&lt;/span&gt;
    &lt;span class="p"&gt;}&lt;/span&gt;
    &lt;span class="k"&gt;return&lt;/span&gt; &lt;span class="n"&gt;ans&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;

&lt;span class="kt"&gt;int&lt;/span&gt; &lt;span class="nf"&gt;main&lt;/span&gt;&lt;span class="p"&gt;()&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="kt"&gt;int&lt;/span&gt; &lt;span class="n"&gt;v&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="n"&gt;e&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
    &lt;span class="n"&gt;cin&lt;/span&gt; &lt;span class="o"&gt;&amp;gt;&amp;gt;&lt;/span&gt; &lt;span class="n"&gt;v&lt;/span&gt; &lt;span class="o"&gt;&amp;gt;&amp;gt;&lt;/span&gt; &lt;span class="n"&gt;e&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
    &lt;span class="n"&gt;vector&lt;/span&gt;&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="n"&gt;vector&lt;/span&gt;&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="kt"&gt;int&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&amp;gt;&lt;/span&gt; &lt;span class="n"&gt;adj&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="n"&gt;e&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;

    &lt;span class="k"&gt;for&lt;/span&gt; &lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="kt"&gt;int&lt;/span&gt; &lt;span class="n"&gt;i&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="mi"&gt;0&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt; &lt;span class="n"&gt;i&lt;/span&gt; &lt;span class="o"&gt;&amp;lt;&lt;/span&gt; &lt;span class="n"&gt;e&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt; &lt;span class="n"&gt;i&lt;/span&gt;&lt;span class="o"&gt;++&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
        &lt;span class="kt"&gt;int&lt;/span&gt; &lt;span class="n"&gt;u&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="n"&gt;v&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="n"&gt;wt&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
        &lt;span class="n"&gt;cin&lt;/span&gt; &lt;span class="o"&gt;&amp;gt;&amp;gt;&lt;/span&gt; &lt;span class="n"&gt;u&lt;/span&gt; &lt;span class="o"&gt;&amp;gt;&amp;gt;&lt;/span&gt; &lt;span class="n"&gt;v&lt;/span&gt; &lt;span class="o"&gt;&amp;gt;&amp;gt;&lt;/span&gt; &lt;span class="n"&gt;wt&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
        &lt;span class="n"&gt;adj&lt;/span&gt;&lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="n"&gt;i&lt;/span&gt;&lt;span class="p"&gt;].&lt;/span&gt;&lt;span class="n"&gt;push_back&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="n"&gt;u&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
        &lt;span class="n"&gt;adj&lt;/span&gt;&lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="n"&gt;i&lt;/span&gt;&lt;span class="p"&gt;].&lt;/span&gt;&lt;span class="n"&gt;push_back&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="n"&gt;v&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
        &lt;span class="n"&gt;adj&lt;/span&gt;&lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="n"&gt;i&lt;/span&gt;&lt;span class="p"&gt;].&lt;/span&gt;&lt;span class="n"&gt;push_back&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="n"&gt;wt&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
    &lt;span class="p"&gt;}&lt;/span&gt;

    &lt;span class="n"&gt;cout&lt;/span&gt; &lt;span class="o"&gt;&amp;lt;&amp;lt;&lt;/span&gt; &lt;span class="n"&gt;spanningTreeForDirectedGraphs&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="n"&gt;v&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="n"&gt;adj&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="n"&gt;e&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
    &lt;span class="k"&gt;return&lt;/span&gt; &lt;span class="mi"&gt;0&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h4&gt;
  
  
  &lt;strong&gt;Let’s Test Our Method with a Simple Case&lt;/strong&gt;
&lt;/h4&gt;

&lt;p&gt;Imagine a directed graph with 3 vertices and the following edges:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;3 3
0 2 5
2 1 3
1 0 1
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;This represents a graph where:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;An edge goes from node 0 to node 2 with a weight of 5.&lt;/li&gt;
&lt;li&gt;An edge goes from node 2 to node 1 with a weight of 3.&lt;/li&gt;
&lt;li&gt;An edge goes from node 1 back to node 0 with a weight of 1.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;After running our algorithm, we see that by removing the edge (1,0), we create a spanning tree with a total weight of &lt;strong&gt;8&lt;/strong&gt;. Voilà! We have successfully navigated through the directed maze!&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Here’s the challenge💪:&lt;/strong&gt; Can we find an MST for weakly connected ones too? Feel free to modify my solution or come up with your own unique approach(remember new and unique is the trend🤌).&lt;/p&gt;

</description>
      <category>algorithms</category>
      <category>dsa</category>
    </item>
    <item>
      <title>Minimum Spanning Trees Breaking the Norm</title>
      <dc:creator>Priya Pandey</dc:creator>
      <pubDate>Fri, 25 Oct 2024 17:19:12 +0000</pubDate>
      <link>https://dev.to/priya2422/minimum-spanning-trees-breaking-the-norm-3oi3</link>
      <guid>https://dev.to/priya2422/minimum-spanning-trees-breaking-the-norm-3oi3</guid>
      <description>&lt;p&gt;It is common for engineers to follow the trend, often overlooking the potential of re-creating solutions. I have a unique approach to a Minimum Spanning Tree (MST) problem using principles inspired by Dijkstra’s algorithm. By stepping away from conventional practices and exploring creative adaptations, we can unlock new pathways for innovation.&lt;/p&gt;

&lt;p&gt;The core idea behind my approach is reminiscent of Dijkstra's algorithm. I maintain a check on all nodes in the graph to ensure that we select the edge that provides the minimum weight for each specific node. This strategy allows us to build the Minimum Spanning Tree (MST) incrementally by always considering the lightest edge connected to any node.&lt;/p&gt;

&lt;p&gt;Here’s how it works:&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;1. Node Connection:&lt;/strong&gt; At each step, I focus on adding a single edge that connects a new node to the growing MST. By selecting the edge with the minimum weight for that node, we effectively ensure that each addition contributes to minimizing the overall tree weight.&lt;br&gt;
&lt;strong&gt;2. Edge Count:&lt;/strong&gt; This process continues until we have added n−1 edges, where n is the total number of nodes in the graph. Since each node must connect to at least one other node(considering it doesn't have an unconnected component) to be included in the tree, we can be confident that all nodes will eventually be connected. As we select the lightest edge for each node, there will never be a scenario where a node is left unconnected; every node reaches another through some edge and we take the minimum one.&lt;br&gt;
&lt;strong&gt;3. Limitations:&lt;/strong&gt; It’s important to note that this approach does not handle negative cycles. Since we rely on the assumption of non-negative edge weights, any negative cycle could disrupt the tree structure and lead to incorrect results.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt; int spanningTree(int V, vector&amp;lt;vector&amp;lt;int&amp;gt;&amp;gt; adj[])
    {
        vector&amp;lt;int&amp;gt; weight(V,INT_MAX);
        vector&amp;lt;vector&amp;lt;int&amp;gt;&amp;gt; mat(V,vector&amp;lt;int&amp;gt;(V,-1));
        for(int i=0;i&amp;lt;V;i++){
            for(auto it: adj[i]){
                mat[i][it[0]]=it[1];
            }
        }
        priority_queue&amp;lt;pair&amp;lt;int,int&amp;gt;,vector&amp;lt;pair&amp;lt;int,int&amp;gt;&amp;gt;,greater&amp;lt;pair&amp;lt;int,int&amp;gt;&amp;gt;&amp;gt; q;
        q.push({0,0});
        weight[0]=0;
        int ans=0;
        while(!q.empty()){
            int node=q.top().second;
            int dis=q.top().first;
            q.pop();
            for(int i=0;i&amp;lt;V;i++){
                int wei=mat[node][i];
                if(weight[i]&amp;gt;wei &amp;amp;&amp;amp; wei!=-1){
                    q.push({wei,i});
                    if(weight[i]!=INT_MAX){
                        ans-=weight[i];
                    }
                    weight[i]=wei;
                    ans+=wei;
                    //this statement ensures that we don't add the bidirectional edge
                    mat[i][node]=-1;
                }
            }
        }
        return ans;
    }
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;I welcome any thoughts on its correctness and potential edge cases that might challenge its validity. Let's discuss how we can further refine this solution and explore scenarios where it may or may not hold up. Your insights and critiques are invaluable in this journey of exploration!&lt;/p&gt;

</description>
      <category>algorithms</category>
      <category>datastructures</category>
      <category>spanningtree</category>
    </item>
    <item>
      <title>Pinata Food Recipe Collaborator</title>
      <dc:creator>Priya Pandey</dc:creator>
      <pubDate>Sun, 13 Oct 2024 19:44:20 +0000</pubDate>
      <link>https://dev.to/priya2422/pinata-food-recipe-collaborator-3b7</link>
      <guid>https://dev.to/priya2422/pinata-food-recipe-collaborator-3b7</guid>
      <description>&lt;p&gt;&lt;em&gt;This is a submission for the &lt;a href="https://dev.to/challenges/pinata"&gt;The Pinata Challenge &lt;/a&gt;&lt;/em&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  What I Built
&lt;/h2&gt;

&lt;p&gt;Being a food lover, I have built a recipe-sharing website where users can upload their recipes, checkout other people recipes and rate them.&lt;/p&gt;

&lt;h1&gt;
  
  
  Features
&lt;/h1&gt;

&lt;ul&gt;
&lt;li&gt;Authentication: Users are required to authenticate themselves.&lt;/li&gt;
&lt;li&gt;Upload Recipe: They can upload there recipes by a form.&lt;/li&gt;
&lt;li&gt;Update and Delete recipe&lt;/li&gt;
&lt;li&gt;Rate recipes&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  Demo
&lt;/h2&gt;

&lt;p&gt;&lt;a href="https://pinata-frontend.onrender.com" rel="noopener noreferrer"&gt;Link to the website&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fhpmr0mx7ao4lz8xs2pln.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fhpmr0mx7ao4lz8xs2pln.png" alt="Image description" width="800" height="450"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fp93dpeblamy99xa3ne0s.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fp93dpeblamy99xa3ne0s.png" alt="Image description" width="800" height="450"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fdqbvbyzoy8i95t8e97kz.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fdqbvbyzoy8i95t8e97kz.png" alt="Image description" width="800" height="450"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  My Code
&lt;/h2&gt;

&lt;p&gt;&lt;a href="https://github.com/tinkerish/pinata-frontend" rel="noopener noreferrer"&gt;Frontend&lt;/a&gt;&lt;br&gt;
&lt;a href="https://github.com/tinkerish/pinata" rel="noopener noreferrer"&gt;Backend&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  More Details
&lt;/h2&gt;

&lt;p&gt;I have used the pinata API for uploading the food image and video files.&lt;/p&gt;

</description>
      <category>devchallenge</category>
      <category>pinatachallenge</category>
      <category>webdev</category>
      <category>api</category>
    </item>
    <item>
      <title>Negative cycle with Dijskta(Possible but not optimal)</title>
      <dc:creator>Priya Pandey</dc:creator>
      <pubDate>Thu, 10 Oct 2024 04:57:33 +0000</pubDate>
      <link>https://dev.to/priya2422/negative-cycle-with-dijsktapossible-but-not-optimal-5605</link>
      <guid>https://dev.to/priya2422/negative-cycle-with-dijsktapossible-but-not-optimal-5605</guid>
      <description>&lt;p&gt;I decided to experiment with Dijkstra’s algorithm to solve a problem that may involve negative cycles. While Dijkstra’s algorithm isn't optimal for graphs with negative weights, I found that it can be adapted with some modifications.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Thought Process Behind Using Dijkstra's Algorithm for Negative Cycles:&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;The core issue with negative cycles is that they can lead to continuously decreasing distances, causing incorrect results. Normally, Dijkstra's algorithm works by updating the distance to a node when a shorter path is found, which happens within an 'if' block that compares the new distance to the previously calculated one. However, with a negative cycle, this comparison will keep returning true because the total distance keeps decreasing as we go around the cycle.&lt;/p&gt;

&lt;p&gt;To handle this, my approach stores the paths for each node. The next time we visit a node, we check whether the node itself is already part of the path leading to it. If the node is found in its own path, it indicates a cycle. This means we are revisiting the node through a cycle that potentially decreases the distance, leading us into the &lt;code&gt;if&lt;/code&gt; block where we detect the negative cycle. On the other hand, if we find a shorter path that doesn’t form a cycle, the node's distance is updated as usual.&lt;/p&gt;

&lt;p&gt;Here’s my code implementation, which adapts Dijkstra’s algorithm while incorporating path tracking:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;vector&amp;lt;int&amp;gt; bellman_ford(int V, vector&amp;lt;vector&amp;lt;int&amp;gt;&amp;gt;&amp;amp; edges, int S) {
    vector&amp;lt;vector&amp;lt;pair&amp;lt;int,int&amp;gt;&amp;gt;&amp;gt; adj(V);
    for(int i=0;i&amp;lt;edges.size();i++){
        adj[edges[i][0]].push_back({edges[i][1],edges[i][2]});
    }
    vector&amp;lt;int&amp;gt; dist(V,1e8);
    dist[S] = 0;
    vector&amp;lt;vector&amp;lt;int&amp;gt;&amp;gt; path(V);
    path[S] = {S};
    queue&amp;lt;pair&amp;lt;int,int&amp;gt;&amp;gt; q;
    q.push({S,0});

    while(!q.empty()) {
        int node = q.front().first;
        int dis = q.front().second;
        q.pop();

        for(auto it: adj[node]) {
            if(dis + it.second &amp;lt; dist[it.first]) {
                vector&amp;lt;int&amp;gt; temp = path[node];

                // Check if the node is already in its path (cycle detection)
                if(find(temp.begin(), temp.end(), it.first) != temp.end()) {
                    return {-1}; // Negative cycle detected
                }

                temp.push_back(it.first);
                path[it.first] = temp;
                q.push({it.first, dis + it.second});
                dist[it.first] = dis + it.second; // Update distance
            }
        }
    }
    return dist;
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;This approach ensures that the block is entered only when a reducing distance is detected, either due to a linear path or a negative cycle. If a cycle is found in the path, the function returns &lt;code&gt;-1&lt;/code&gt; to indicate the presence of a negative cycle. Otherwise, it updates the distance accordingly.&lt;/p&gt;

&lt;p&gt;Let me know your thoughts on this.&lt;/p&gt;

</description>
      <category>dsa</category>
      <category>algorithms</category>
      <category>graph</category>
    </item>
    <item>
      <title>Frontend Challenge v24.09.04-Space Edition</title>
      <dc:creator>Priya Pandey</dc:creator>
      <pubDate>Sun, 15 Sep 2024 15:11:22 +0000</pubDate>
      <link>https://dev.to/priya2422/frontend-challenge-v240904-space-edition-2g17</link>
      <guid>https://dev.to/priya2422/frontend-challenge-v240904-space-edition-2g17</guid>
      <description>&lt;p&gt;&lt;em&gt;This is a submission for &lt;a href="https://dev.to/challenges/frontend-2024-09-04"&gt;Frontend Challenge v24.09.04&lt;/a&gt;, Glam Up My Markup: Space&lt;/em&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  What I Built
&lt;/h2&gt;

&lt;p&gt;I have built the solar system using three js and it's my first time using the tool. My idea was to represent those bits pieces of space on a 3D plane.&lt;/p&gt;

&lt;h2&gt;
  
  
  Demo
&lt;/h2&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F2j23rsuf34lahzkh9yr8.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F2j23rsuf34lahzkh9yr8.gif" alt="Image description" width="800" height="441"&gt;&lt;/a&gt;&lt;br&gt;
&lt;a href="https://github.com/tinkerish/dev-2" rel="noopener noreferrer"&gt;GitHub code link&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Journey
&lt;/h2&gt;

&lt;p&gt;I always wanted to do something one day with three js. I have heard about this a lot from YouTubers and other forums. Never really got a chance to build something so tried the challenge using the same. I wish to elaborate this to make a portfolio of my life integrating the idea of the space couldn't do this here because had to use the markup given in the challenge.&lt;/p&gt;

</description>
      <category>devchallenge</category>
      <category>frontendchallenge</category>
      <category>css</category>
      <category>javascript</category>
    </item>
    <item>
      <title>Frontend Dev Challenge</title>
      <dc:creator>Priya Pandey</dc:creator>
      <pubDate>Sun, 04 Aug 2024 17:14:07 +0000</pubDate>
      <link>https://dev.to/priya2422/frontend-dev-challenge-43a8</link>
      <guid>https://dev.to/priya2422/frontend-dev-challenge-43a8</guid>
      <description>&lt;p&gt;&lt;em&gt;This is a submission for &lt;a href="https://dev.to/challenges/frontend-2024-07-24"&gt;Frontend Challenge v24.07.24&lt;/a&gt;, CSS Art: Recreation.&lt;/em&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Inspiration
&lt;/h2&gt;

&lt;p&gt;I like to binge-watch things when I have the time to do so. This recreation showcases my Netflix journey. What could be more relaxing than watching your favorite show with your favorite snacks?&lt;/p&gt;

&lt;h2&gt;
  
  
  Demo
&lt;/h2&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fwz5gs2ugspxy3rosa6ga.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fwz5gs2ugspxy3rosa6ga.png" alt="Image description" width="800" height="369"&gt;&lt;/a&gt;&lt;br&gt;
GitHub Code Link :- &lt;a href="https://github.com/tinkerish/dev_challenge" rel="noopener noreferrer"&gt;Code&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Journey
&lt;/h2&gt;

&lt;p&gt;I usually don't have time as I am a working professional. But I clearly enjoy watching K-Dramas, C-Dramas, Thai Dramas, and many more. Apart from these I also enjoy creating quirky things with CSS. I had no idea we could build literally everything with CSS just like with pen and paper until I tried it myself. I enjoyed building my imagination thanks to the challenge.&lt;/p&gt;

</description>
      <category>frontendchallenge</category>
      <category>devchallenge</category>
      <category>css</category>
    </item>
  </channel>
</rss>
