From 12f1eff9363f92359e74d40703696f1438004ef0 Mon Sep 17 00:00:00 2001
From: nafistiham <nafistiham@gmail.com>
Date: Thu, 13 Jul 2023 11:35:29 +0600
Subject: [PATCH 1/5] use-insertion-effect-30%

---
 .../reference/react/useInsertionEffect.md     | 46 +++++++++----------
 1 file changed, 23 insertions(+), 23 deletions(-)

diff --git a/src/content/reference/react/useInsertionEffect.md b/src/content/reference/react/useInsertionEffect.md
index 175b4476f..968da1a92 100644
--- a/src/content/reference/react/useInsertionEffect.md
+++ b/src/content/reference/react/useInsertionEffect.md
@@ -4,13 +4,13 @@ title: useInsertionEffect
 
 <Pitfall>
 
-`useInsertionEffect` is for CSS-in-JS library authors. Unless you are working on a CSS-in-JS library and need a place to inject the styles, you probably want [`useEffect`](/reference/react/useEffect) or [`useLayoutEffect`](/reference/react/useLayoutEffect) instead.
+`useInsertionEffect`  CSS-in-JS library author-দের জন্য। যদি না আপনি একটি কাজ করছেন এবং স্টাইল ইনজেক্ট করার জন্য একটা জায়গার প্রয়োজন বোধ করছেন, সম্ভবত আপনি `useInsertionEffect` এর বদলে [`useEffect`](/reference/react/useEffect) অথবা [`useLayoutEffect`](/reference/react/useLayoutEffect) ব্যবহার করতে চান।
 
 </Pitfall>
 
 <Intro>
 
-`useInsertionEffect` is a version of [`useEffect`](/reference/react/useEffect) that fires before any DOM mutations.
+`useInsertionEffect` হচ্ছে [`useEffect`](/reference/react/useEffect) এর একটি ভার্শন যা যেকোন DOM মিউটেশনের আগে fire হয়।
 
 ```js
 useInsertionEffect(setup, dependencies?)
@@ -22,55 +22,55 @@ useInsertionEffect(setup, dependencies?)
 
 ---
 
-## Reference {/*reference*/}
+## রেফারেন্স {/*reference*/}
 
 ### `useInsertionEffect(setup, dependencies?)` {/*useinsertioneffect*/}
 
-Call `useInsertionEffect` to insert the styles before any DOM mutations:
+যেকোন DOM মিউটেশনের আগে স্টাইল ইনসার্ট করার জন্য `useInsertionEffect` কল করুনঃ
 
 ```js
 import { useInsertionEffect } from 'react';
 
-// Inside your CSS-in-JS library
+// আপনার CSS-in-JS লাইব্রেরির মধ্যে
 function useCSS(rule) {
   useInsertionEffect(() => {
-    // ... inject <style> tags here ...
+    // ... <style> ট্যাগগুলো এখানে ইনজেক্ট করুন ...
   });
   return rule;
 }
 ```
 
-[See more examples below.](#usage)
+[নিচে আরো উদাহরণ দেখুন।](#usage)
 
-#### Parameters {/*parameters*/}
+#### প্যারামিটার {/*parameters*/}
 
-* `setup`: The function with your Effect's logic. Your setup function may also optionally return a *cleanup* function. Before your component is added to the DOM, React will run your setup function. After every re-render with changed dependencies, React will first run the cleanup function (if you provided it) with the old values, and then run your setup function with the new values. Before your component is removed from the DOM, React will run your cleanup function.
+* `setup`: যেই ফাংশনে আপনার Effect এর লজিক আছে। আপনার সেটআপ ফাংশন একটি *cleanup* ফাংশন optionally রিটার্ন করতে পারে। আপনার কম্পোনেন্ট DOM এ যুক্ত হবার আগে, React আপনার সেটআপ ফাংশন রান করবে। পরিবর্তিত ডিপেন্ডেন্সির সাথে যতবার রি-রেন্ডার হবে, React প্রথমে আপনার পুরনো ভ্যালুগুলো ব্যবহার করে cleanup ফাংশন রান করবে (যদি আপনি দিয়ে থাকেন), তারপর নতুন ভ্যালুগুলো ব্যবহার করে সেটআপ ফাংশন রান করবে। আপনার কম্পোনেন্ট DOM থেকে সরিয়ে ফেলবার আগে, React আপনার cleanup ফাংশন রান করবে।
  
 * **optional** `dependencies`: The list of all reactive values referenced inside of the `setup` code. Reactive values include props, state, and all the variables and functions declared directly inside your component body. If your linter is [configured for React](/learn/editor-setup#linting), it will verify that every reactive value is correctly specified as a dependency. The list of dependencies must have a constant number of items and be written inline like `[dep1, dep2, dep3]`. React will compare each dependency with its previous value using the [`Object.is`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/is) comparison algorithm. If you don't specify the dependencies at all, your Effect will re-run after every re-render of the component.
 
-#### Returns {/*returns*/}
+#### রিটার্ন {/*returns*/}
 
-`useInsertionEffect` returns `undefined`.
+`useInsertionEffect` রিটার্ন করে `undefined`.
 
-#### Caveats {/*caveats*/}
+#### সতর্কতা {/*caveats*/}
 
-* Effects only run on the client. They don't run during server rendering.
-* You can't update state from inside `useInsertionEffect`.
-* By the time `useInsertionEffect` runs, refs are not attached yet, and DOM is not yet updated.
+* Effects শুধুমাত্র ক্লায়েন্টে কাজ করে। এগুলো সার্ভার রেন্ডারিং এর সময় রান করে না।
+* আপনি `useInsertionEffect` এর মধ্য হতে state আপডেট করতে পারবেন না।
+* যতক্ষণে `useInsertionEffect` রান করে, ref তখনো যুক্ত হয় নাই এবং DOM আপডেট হয় নাই।
 
 ---
 
-## Usage {/*usage*/}
+## ব্যবহার {/*usage*/}
 
-### Injecting dynamic styles from CSS-in-JS libraries {/*injecting-dynamic-styles-from-css-in-js-libraries*/}
+### CSS-in-JS লাইব্রেরিতে dynamic styles injection {/*injecting-dynamic-styles-from-css-in-js-libraries*/}
 
-Traditionally, you would style React components using plain CSS.
+প্রথাগতভাবে, আপনি React কম্পোনেন্ট plain CSS ব্যবহার করেই স্টাইল করবেন। 
 
 ```js
-// In your JS file:
+// আপনার JS ফাইলেঃ
 <button className="success" />
 
-// In your CSS file:
+// আপনার CSS ফাইলেঃ
 .success { color: green; }
 ```
 
@@ -90,12 +90,12 @@ The first problem is not solvable, but `useInsertionEffect` helps you solve the
 Call `useInsertionEffect` to insert the styles before any DOM mutations:
 
 ```js {4-11}
-// Inside your CSS-in-JS library
+// আপনার CSS-in-JS লাইব্রেরির মধ্যে
 let isInserted = new Set();
 function useCSS(rule) {
   useInsertionEffect(() => {
-    // As explained earlier, we don't recommend runtime injection of <style> tags.
-    // But if you have to do it, then it's important to do in useInsertionEffect.
+    // আগেই যেভাবে ব্যখ্যা করা হয়েছে, আমরা রানটাইমে <style> ট্যাগ ইনজেক্ট না করার পরামর্শ দেই।
+    // কিন্তু যদি আপনাকে এটা করতেই হয়, এটা useInsertionEffect এর মধ্যে করা জরুরি।
     if (!isInserted.has(rule)) {
       isInserted.add(rule);
       document.head.appendChild(getStyleForRule(rule));

From 1fa38a050e3731cc9cb4cd26e646d393359445b5 Mon Sep 17 00:00:00 2001
From: nafistiham <nafistiham@gmail.com>
Date: Sun, 30 Jul 2023 18:01:57 +0600
Subject: [PATCH 2/5] 90%

---
 .../reference/react/useInsertionEffect.md     | 22 +++++++++----------
 1 file changed, 11 insertions(+), 11 deletions(-)

diff --git a/src/content/reference/react/useInsertionEffect.md b/src/content/reference/react/useInsertionEffect.md
index 968da1a92..49c9fbaf4 100644
--- a/src/content/reference/react/useInsertionEffect.md
+++ b/src/content/reference/react/useInsertionEffect.md
@@ -74,20 +74,20 @@ function useCSS(rule) {
 .success { color: green; }
 ```
 
-Some teams prefer to author styles directly in JavaScript code instead of writing CSS files. This usually requires using a CSS-in-JS library or a tool. There are three common approaches to CSS-in-JS:
+কেউ কেউ CSS ফাইল লেখবার জায়গায় সরাসরি জাভস্ক্রিপ্ট এর মধ্যে স্টাইল অথর করা পছন্দ করেন। এতে সাধারণত কোন CSS-in-JS লাইব্রেরি বা কোন একটি টুল ব্যবহার করা প্রয়োজন পড়ে। CSS-in-JS ব্যবহারের তিনটি বহুল ব্যবহৃত পদ্ধতি আছে।  Some teams prefer to author styles directly in JavaScript code instead of writing CSS files. This usually requires using a CSS-in-JS library or a tool. There are three common approaches to CSS-in-JS:
 
 1. Static extraction to CSS files with a compiler
 2. Inline styles, e.g. `<div style={{ opacity: 1 }}>`
 3. Runtime injection of `<style>` tags
 
-If you use CSS-in-JS, we recommend a combination of the first two approaches (CSS files for static styles, inline styles for dynamic styles). **We don't recommend runtime `<style>` tag injection for two reasons:**
+আপনি যদি CSS-in-JS ব্যবহার করেন, আমরা উপরের দুটি পদ্ধতির সমন্বয় ব্যবহার করতে উপদেশ দেব (স্ট্যাটিক স্টাইলের জন্য CSS ফাইল, ডাইনামিক স্টাইলের জন্য ইনলাইন স্টাইল।) **আমরা দুটি কারণে রানটাইম `<style>` ট্যাগ ইনজেকশন এড়িয়ে চলতে বলবঃ**
 
-1. Runtime injection forces the browser to recalculate the styles a lot more often.
-2. Runtime injection can be very slow if it happens at the wrong time in the React lifecycle.
+1. রানটাইম ইনজেকশনের ক্ষেত্রে স্টাইলগুলোকে বার বার হিসেব করতে বাধ্য হয় ব্রাউজার। 
+2. React লাইফসাইকেলের ভুল একটা সময়ে যদি রানটাইম ইনজেকশন হয় তাহলে সেটা খুবই ধীরগতির হতে পারে। 
 
-The first problem is not solvable, but `useInsertionEffect` helps you solve the second problem.
+প্রথম সমস্যাটা সমাধানযোগ্য নয়, কিন্তু `useInsertionEffect` আপনাকে দ্বিতীয় সমস্যাটা সমাধানে সাহায্য করবে। 
 
-Call `useInsertionEffect` to insert the styles before any DOM mutations:
+যেকোন DOM মিউটেশনের আগে স্টাইল ইনসার্ট করার জন্য `useInsertionEffect` কল করুনঃ
 
 ```js {4-11}
 // আপনার CSS-in-JS লাইব্রেরির মধ্যে
@@ -110,7 +110,7 @@ function Button() {
 }
 ```
 
-Similarly to `useEffect`, `useInsertionEffect` does not run on the server. If you need to collect which CSS rules have been used on the server, you can do it during rendering:
+`useEffect` এর ন্যায়, `useInsertionEffect` সার্ভারে রান করে না। আপনার যদু সার্ভারে ব্যবহৃত CSS rule গুলো সংগ্রহ করার প্রয়োজন পড়ে, আপনি সেটা রেন্ডারিং এর সময়ে করতে পারেনঃ
 
 ```js {1,4-6}
 let collectedRulesSet = new Set();
@@ -126,14 +126,14 @@ function useCSS(rule) {
 }
 ```
 
-[Read more about upgrading CSS-in-JS libraries with runtime injection to `useInsertionEffect`.](https://github.com/reactwg/react-18/discussions/110)
+[CSS-in-JS libraries with runtime injection থেকে `useInsertionEffect` এ আপগ্রেড নিয়ে আরো পড়ুন।](https://github.com/reactwg/react-18/discussions/110)
 
 <DeepDive>
 
-#### How is this better than injecting styles during rendering or useLayoutEffect? {/*how-is-this-better-than-injecting-styles-during-rendering-or-uselayouteffect*/}
+#### Rendering বা useLayoutEffect এর সময় স্টাইল ইঞ্জেক্ট করবার চেয়ে এটা কীভাবে আরো ভাল? {/*how-is-this-better-than-injecting-styles-during-rendering-or-uselayouteffect*/}
 
-If you insert styles during rendering and React is processing a [non-blocking update,](/reference/react/useTransition#marking-a-state-update-as-a-non-blocking-transition) the browser will recalculate the styles every single frame while rendering a component tree, which can be **extremely slow.**
+আপনি যদি রেন্ডারিং এর সময় স্টাইল ইনসার্ট করেন যখন React একটি [নন-ব্লকিং আপডেট,](/reference/react/useTransition#marking-a-state-update-as-a-non-blocking-transition) প্রসেস করছে, ব্রাউজার একটি কম্পোনেন্ট ট্রি রেন্ডার করতে করতে প্রতিটা ফ্রেমে স্টাইলগুলো আবার হিসেব করে, যেটা **অত্যন্ত ধীরগতির হতে পারে।** 
 
-`useInsertionEffect` is better than inserting styles during [`useLayoutEffect`](/reference/react/useLayoutEffect) or [`useEffect`](/reference/react/useEffect) because it ensures that by the time other Effects run in your components, the `<style>` tags have already been inserted. Otherwise, layout calculations in regular Effects would be wrong due to outdated styles.
+[`useLayoutEffect`](/reference/react/useLayoutEffect) বা [`useEffect`](/reference/react/useEffect) এর সময় স্টাইল ইনসার্ট করার চেয়ে `useInsertionEffect` ভাল, কারণ এটা নিশ্চিত করে যে যতক্ষণে আপনার কম্পোনেন্টে অন্যান্য Effect রান করছে, ততক্ষণে সকল `<style>` ট্যাগ ইনসার্ট করা হয়ে গেছে। অন্যথায়, পুরনো স্টাইলের কারণে সাধারণ Effect এ লেআউটের হিসেব ভুল হবে।
 
 </DeepDive>

From 5e38687707afea78a02a486bf9d179687687002a Mon Sep 17 00:00:00 2001
From: nafistiham <nafistiham@gmail.com>
Date: Thu, 3 Aug 2023 12:26:32 +0600
Subject: [PATCH 3/5] use-insertion-effect-cent-percent

---
 src/content/reference/react/useInsertionEffect.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/content/reference/react/useInsertionEffect.md b/src/content/reference/react/useInsertionEffect.md
index 49c9fbaf4..96ac11ea6 100644
--- a/src/content/reference/react/useInsertionEffect.md
+++ b/src/content/reference/react/useInsertionEffect.md
@@ -46,7 +46,7 @@ function useCSS(rule) {
 
 * `setup`: যেই ফাংশনে আপনার Effect এর লজিক আছে। আপনার সেটআপ ফাংশন একটি *cleanup* ফাংশন optionally রিটার্ন করতে পারে। আপনার কম্পোনেন্ট DOM এ যুক্ত হবার আগে, React আপনার সেটআপ ফাংশন রান করবে। পরিবর্তিত ডিপেন্ডেন্সির সাথে যতবার রি-রেন্ডার হবে, React প্রথমে আপনার পুরনো ভ্যালুগুলো ব্যবহার করে cleanup ফাংশন রান করবে (যদি আপনি দিয়ে থাকেন), তারপর নতুন ভ্যালুগুলো ব্যবহার করে সেটআপ ফাংশন রান করবে। আপনার কম্পোনেন্ট DOM থেকে সরিয়ে ফেলবার আগে, React আপনার cleanup ফাংশন রান করবে।
  
-* **optional** `dependencies`: The list of all reactive values referenced inside of the `setup` code. Reactive values include props, state, and all the variables and functions declared directly inside your component body. If your linter is [configured for React](/learn/editor-setup#linting), it will verify that every reactive value is correctly specified as a dependency. The list of dependencies must have a constant number of items and be written inline like `[dep1, dep2, dep3]`. React will compare each dependency with its previous value using the [`Object.is`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/is) comparison algorithm. If you don't specify the dependencies at all, your Effect will re-run after every re-render of the component.
+* **optional** `dependencies`: `setup` কোডের মধ্যে রেফারেন্স করা সকল রিয়াক্টিভ ভ্যালুর তালিকা। রিয়াক্টিভ ভ্যালুর মধ্যে রয়েছে props, state এবং আপনার কম্পোনেন্ট বডির মধ্যে সরাসরি ডিক্লেয়ার হঅ্যা সকল ভ্যারিয়েবল এবং ফাংশন। যদি আপনার লিন্টার  [React এর জন্য কনফিগার করা থাকে](/learn/editor-setup#linting), এটা নিশ্চিত করবে যে প্রতিটা রিয়াক্টিভ ভ্যালু সঠিকভাবে ডিপেন্ডেন্সি হিসেবে চিহ্নিত করা আছে। ডিপেন্ডেন্সির তালিকাতে অবশ্যই আইটেমের সংখ্যা ধ্রুবক হতে হবে এবং `[dep1, dep2, dep3]` এর মত ইনলাইনে থাকতে হবে।  React will compare each dependency with its previous value using the [`Object.is`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/is) comparison algorithn ব্যবহার করে প্রতিটা ডিপেন্ডেন্সি এবং এর আগের ভ্যালু তুলনা করবে।আপনি যদি ডিপেন্ডেন্সি চিহ্নিত করে না দেন, আপনার Effect কম্পোনেন্টের প্রতিটি re-render এ re-run হবে।
 
 #### রিটার্ন {/*returns*/}
 

From 8b8e2d24da31ff879ddd780443d4da5ed5840891 Mon Sep 17 00:00:00 2001
From: nafistiham <nafistiham@gmail.com>
Date: Thu, 3 Aug 2023 12:35:45 +0600
Subject: [PATCH 4/5] missing-line-added

---
 src/content/reference/react/useInsertionEffect.md | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/content/reference/react/useInsertionEffect.md b/src/content/reference/react/useInsertionEffect.md
index 96ac11ea6..7d0813014 100644
--- a/src/content/reference/react/useInsertionEffect.md
+++ b/src/content/reference/react/useInsertionEffect.md
@@ -74,11 +74,11 @@ function useCSS(rule) {
 .success { color: green; }
 ```
 
-কেউ কেউ CSS ফাইল লেখবার জায়গায় সরাসরি জাভস্ক্রিপ্ট এর মধ্যে স্টাইল অথর করা পছন্দ করেন। এতে সাধারণত কোন CSS-in-JS লাইব্রেরি বা কোন একটি টুল ব্যবহার করা প্রয়োজন পড়ে। CSS-in-JS ব্যবহারের তিনটি বহুল ব্যবহৃত পদ্ধতি আছে।  Some teams prefer to author styles directly in JavaScript code instead of writing CSS files. This usually requires using a CSS-in-JS library or a tool. There are three common approaches to CSS-in-JS:
+কেউ কেউ CSS ফাইল লেখবার জায়গায় সরাসরি জাভস্ক্রিপ্ট এর মধ্যে স্টাইল অথর করা পছন্দ করেন। এতে সাধারণত কোন CSS-in-JS লাইব্রেরি বা কোন একটি টুল ব্যবহার করা প্রয়োজন পড়ে। CSS-in-JS ব্যবহারের তিনটি বহুল ব্যবহৃত পদ্ধতি আছেঃ
 
-1. Static extraction to CSS files with a compiler
-2. Inline styles, e.g. `<div style={{ opacity: 1 }}>`
-3. Runtime injection of `<style>` tags
+1. কম্পাইলার ব্যবহার করে CSS ফাইলে স্ট্যাটিক এক্সট্রাকশন
+2. ইনলাইন স্টাইল, যেমন, `<div style={{ opacity: 1 }}>`
+3. `<style>` ট্যাগের রানটাইম ইনজেকশন
 
 আপনি যদি CSS-in-JS ব্যবহার করেন, আমরা উপরের দুটি পদ্ধতির সমন্বয় ব্যবহার করতে উপদেশ দেব (স্ট্যাটিক স্টাইলের জন্য CSS ফাইল, ডাইনামিক স্টাইলের জন্য ইনলাইন স্টাইল।) **আমরা দুটি কারণে রানটাইম `<style>` ট্যাগ ইনজেকশন এড়িয়ে চলতে বলবঃ**
 

From f699e661c93d2b7de34607ed2ef99a64d3eabffc Mon Sep 17 00:00:00 2001
From: nafistiham <nafistiham@gmail.com>
Date: Tue, 8 Aug 2023 11:48:44 +0600
Subject: [PATCH 5/5] resolved-change-request

---
 src/content/reference/react/useInsertionEffect.md | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/content/reference/react/useInsertionEffect.md b/src/content/reference/react/useInsertionEffect.md
index a7a960478..90b9b4327 100644
--- a/src/content/reference/react/useInsertionEffect.md
+++ b/src/content/reference/react/useInsertionEffect.md
@@ -46,7 +46,7 @@ function useCSS(rule) {
 
 * `setup`: যেই ফাংশনে আপনার Effect এর লজিক আছে। আপনার সেটআপ ফাংশন একটি *cleanup* ফাংশন optionally রিটার্ন করতে পারে। আপনার কম্পোনেন্ট DOM এ যুক্ত হবার সময়, কিন্তু কোন লেআউট effect fire করার আগে, React আপনার সেটআপ ফাংশন রান করবে। পরিবর্তিত ডিপেন্ডেন্সির সাথে যতবার রি-রেন্ডার হবে, React প্রথমে আপনার পুরনো ভ্যালুগুলো ব্যবহার করে cleanup ফাংশন রান করবে (যদি আপনি দিয়ে থাকেন), তারপর নতুন ভ্যালুগুলো ব্যবহার করে সেটআপ ফাংশন রান করবে। আপনার কম্পোনেন্ট DOM থেকে সরিয়ে ফেলবার আগে, React আপনার cleanup ফাংশন রান করবে।
  
-* **optional** `dependencies`: `setup` কোডের মধ্যে রেফারেন্স করা সকল রিয়াক্টিভ ভ্যালুর তালিকা। রিয়াক্টিভ ভ্যালুর মধ্যে রয়েছে props, state এবং আপনার কম্পোনেন্ট বডির মধ্যে সরাসরি ডিক্লেয়ার হঅ্যা সকল ভ্যারিয়েবল এবং ফাংশন। যদি আপনার লিন্টার  [React এর জন্য কনফিগার করা থাকে](/learn/editor-setup#linting), এটা নিশ্চিত করবে যে প্রতিটা রিয়াক্টিভ ভ্যালু সঠিকভাবে ডিপেন্ডেন্সি হিসেবে চিহ্নিত করা আছে। ডিপেন্ডেন্সির তালিকাতে অবশ্যই আইটেমের সংখ্যা ধ্রুবক হতে হবে এবং `[dep1, dep2, dep3]` এর মত ইনলাইনে থাকতে হবে।  React will compare each dependency with its previous value using the [`Object.is`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/is) comparison algorithn ব্যবহার করে প্রতিটা ডিপেন্ডেন্সি এবং এর আগের ভ্যালু তুলনা করবে।আপনি যদি ডিপেন্ডেন্সি চিহ্নিত করে না দেন, আপনার Effect কম্পোনেন্টের প্রতিটি re-render এ re-run হবে।
+* **optional** `dependencies`: `setup` কোডের মধ্যে রেফারেন্স করা সকল রিয়াক্টিভ ভ্যালুর তালিকা। রিয়াক্টিভ ভ্যালুর মধ্যে রয়েছে props, state এবং আপনার কম্পোনেন্ট বডির মধ্যে সরাসরি ডিক্লেয়ার হওয়া সকল ভ্যারিয়েবল এবং ফাংশন। যদি আপনার লিন্টার  [React এর জন্য কনফিগার করা থাকে](/learn/editor-setup#linting), এটা নিশ্চিত করবে যে প্রতিটা রিয়াক্টিভ ভ্যালু সঠিকভাবে ডিপেন্ডেন্সি হিসেবে চিহ্নিত করা আছে। ডিপেন্ডেন্সির তালিকাতে অবশ্যই আইটেমের সংখ্যা ধ্রুবক হতে হবে এবং `[dep1, dep2, dep3]` এর মত ইনলাইনে থাকতে হবে।  React will compare each dependency with its previous value using the [`Object.is`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/is) comparison algorithn ব্যবহার করে প্রতিটা ডিপেন্ডেন্সি এবং এর আগের ভ্যালু তুলনা করবে।আপনি যদি ডিপেন্ডেন্সি চিহ্নিত করে না দেন, আপনার Effect কম্পোনেন্টের প্রতিটি re-render এ re-run হবে।
 
 #### রিটার্ন {/*returns*/}
 
@@ -75,7 +75,7 @@ function useCSS(rule) {
 .success { color: green; }
 ```
 
-কেউ কেউ CSS ফাইল লেখবার জায়গায় সরাসরি জাভস্ক্রিপ্ট এর মধ্যে স্টাইল অথর করা পছন্দ করেন। এতে সাধারণত কোন CSS-in-JS লাইব্রেরি বা কোন একটি টুল ব্যবহার করা প্রয়োজন পড়ে। CSS-in-JS ব্যবহারের তিনটি বহুল ব্যবহৃত পদ্ধতি আছেঃ
+কেউ কেউ আলাদা CSS ফাইলে স্টাইল করার কোড লেখার চেয়ে জাভাস্ক্রিপ্টে স্টাইল কোড লিখতে পছন্দ করেন। এতে সাধারণত কোন CSS-in-JS লাইব্রেরি বা কোন একটি টুল ব্যবহার করা প্রয়োজন পড়ে। CSS-in-JS ব্যবহারের তিনটি বহুল ব্যবহৃত পদ্ধতি আছেঃ
 
 1. কম্পাইলার ব্যবহার করে CSS ফাইলে স্ট্যাটিক এক্সট্রাকশন
 2. ইনলাইন স্টাইল, যেমন, `<div style={{ opacity: 1 }}>`
@@ -111,7 +111,7 @@ function Button() {
 }
 ```
 
-`useEffect` এর ন্যায়, `useInsertionEffect` সার্ভারে রান করে না। আপনার যদু সার্ভারে ব্যবহৃত CSS rule গুলো সংগ্রহ করার প্রয়োজন পড়ে, আপনি সেটা রেন্ডারিং এর সময়ে করতে পারেনঃ
+`useEffect` এর ন্যায়, `useInsertionEffect` সার্ভারে রান করে না। আপনার যদি সার্ভারে ব্যবহৃত CSS rule গুলো সংগ্রহ করার প্রয়োজন পড়ে, আপনি সেটা রেন্ডারিং এর সময়ে করতে পারেনঃ
 
 ```js {1,4-6}
 let collectedRulesSet = new Set();