adityacodepublic

Why unstable_cache keyparts is optional

1. unstable cache can like do basic function analysis. Hence why keyparts is optional. You can either use that or just pass the id as args to the function signature so it can see the IDs changing.

   Basically you either help nextjs figure out the function is changing by passing ids as args.. or you just do it yourself by putting the IDs in keyparts

2. In the example below, using string literals like shopify in the key part array is not necessary. They never change, so they never do anything.

   <div key="shopify" />

   It's like the key here does nothing since it never changes.

adityacodepublic

Caching diagram Next js

---

React cache and Next js cache

adityacodepublic

PRINT HIDDEN HTML ELEMENTS

• some conditionally rendered elements are not easily, debuggable in elements in dev tools. as they can get removed as we interact with the dev console.
• so paste this in the console, with the classname or attributes of the element to watch. -> and the element will get printed in the console.
• make sure to add your element attributes like id, or .class etc........

const observer = new MutationObserver((mutations) => {
    mutations.forEach((mutation) => {
      mutation.addedNodes.forEach((node) => {
        if (

adityacodepublic

Some utils

const isDateObject = (value: unknown): value is Date => value instanceof Date;

const isNullOrUndefined = (value: unknown): value is null | undefined =>
  value == null;

const isObjectType = (value: unknown): value is object =>
  typeof value === "object";

adityacodepublic

react hook form controller component that returns useController, or register return based on controlled boolean prop (default: true )

requires your form wrapped in FormProvider

import type {
  FieldPath,
  FieldValues,
  ControllerProps,
  UseControllerProps,
  UseFormRegisterReturn,