You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Notice how the active connection count in the console doesn't keep growing anymore.
829
+
لاحظ أن عدد الاتصالات النشطة في وحدة التحكم لم يعد يتزايد باستمرار.
830
830
831
-
Without Strict Mode, it was easy to miss that your Effect needed cleanup. By running *setup → cleanup → setup* instead of *setup* for your Effect in development, Strict Mode made the missing cleanup logic more noticeable.
831
+
بدون Strict Mode، كان من السهل تفويت أن تأثيرك يحتاج تنظيمًا. بتشغيل *إعداد → تنظيف → إعداد* بدل *إعداد* فقط لتأثيرك في التطوير، جعل Strict Mode نقص منطق التنظيف أكثر بروزًا.
832
832
833
-
[Read more about implementing Effect cleanup.](/learn/synchronizing-with-effects#how-to-handle-the-effect-firing-twice-in-development)
833
+
[اقرأ المزيد عن تنفيذ تنظيف التأثير.](/learn/synchronizing-with-effects#how-to-handle-the-effect-firing-twice-in-development)
834
834
835
835
---
836
-
### Fixing bugs found by re-running ref callbacks in development {/*fixing-bugs-found-by-re-running-ref-callbacks-in-development*/}
836
+
### إصلاح أخطاء يكشفها إعادة تشغيل استدعاءات ref في التطوير {/*fixing-bugs-found-by-re-running-ref-callbacks-in-development*/}
837
837
838
-
Strict Mode can also help find bugs in [callbacks refs.](/learn/manipulating-the-dom-with-refs)
838
+
يمكن لـ Strict Mode أيضًا المساعدة في إيجاد أخطاء في [استدعاءات ref (callback refs).](/learn/manipulating-the-dom-with-refs)
839
839
840
-
Every callback `ref`has some setup code and may have some cleanup code. Normally, React calls setup when the element is *created* (is added to the DOM) and calls cleanup when the element is *removed* (is removed from the DOM).
840
+
لكل callback `ref`كود إعداد وقد يكون له تنظيف. عادةً، تستدعي React الإعداد عند *إنشاء* العنصر (إضافته إلى DOM) والتنظيف عند *إزالته* من DOM.
841
841
842
-
When Strict Mode is on, React will also run **one extra setup+cleanup cycle in development for every callback `ref`.** This may feel surprising, but it helps reveal subtle bugs that are hard to catch manually.
842
+
عند تفعيل Strict Mode، تشغّل React أيضًا **دورة إعداد+تنظيف إضافية في التطوير لكل callback `ref`.** قد يبدو ذلك مفاجئًا، لكنه يكشف أخطاء دقيقة يصعُب اصطيادها يدويًا.
843
843
844
-
Consider this example, which allows you to select an animal and then scroll to one of them. Notice when you switch from "Cats" to "Dogs", the console logs show that the number of animals in the list keeps growing, and the "Scroll to" buttons stop working:
844
+
انظر إلى هذا المثال الذي يتيح اختيار حيوان ثم التمرير إليه. لاحظ عند التبديل بين «Cats» و«Dogs» أن سجلات وحدة التحكم تُظهر أن عدد الحيوانات في القائمة يزداد، وتتوقف أزرار «Scroll to» عن العمل:
845
845
846
846
<Sandpack>
847
847
@@ -960,9 +960,9 @@ li {
960
960
</Sandpack>
961
961
962
962
963
-
**This is a production bug!** Since the ref callback doesn't remove animals from the list in the cleanup, the list of animals keeps growing. This is a memory leak that can cause performance problems in a real app, and breaks the behavior of the app.
963
+
**هذا خطأ إنتاجي!** بما أن callback الـ ref لا يزيل الحيوانات من القائمة في التنظيف، تستمر القائمة بالنمو. هذا تسرّب ذاكرة قد يسبب مشاكل أداء في تطبيق حقيقي، ويكسر سلوك التطبيق.
964
964
965
-
The issue is the ref callback doesn't cleanup after itself:
965
+
المشكلة أن callback الـ ref لا ينظّف نفسه:
966
966
967
967
```js {6-8}
968
968
<li
@@ -977,7 +977,7 @@ The issue is the ref callback doesn't cleanup after itself:
977
977
</li>
978
978
```
979
979
980
-
Now let's wrap the original (buggy) code in `<StrictMode>`:
980
+
الآن لِنلفّ الكود الأصلي (الخاطئ) بـ`<StrictMode>`:
981
981
982
982
<Sandpack>
983
983
@@ -1100,9 +1100,9 @@ li {
1100
1100
1101
1101
</Sandpack>
1102
1102
1103
-
**With Strict Mode, you immediately see that there is a problem**. Strict Mode runs an extra setup+cleanup cycle for every callback ref. This callback ref has no cleanup logic, so it adds refs but doesn't remove them. This is a hint that you're missing a cleanup function.
1103
+
**مع Strict Mode، ترى فورًا أن هناك مشكلة.** يشغّل Strict Mode دورة إعداد+تنظيف إضافية لكل callback ref. هذا الـ callback بلا تنظيف، فيضيف عناصر ولا يزيلها. هذا تلميح بأنك تفتقد دالة تنظيف.
1104
1104
1105
-
Strict Mode lets you eagerly find mistakes in callback refs. When you fix your callback by adding a cleanup function in Strict Mode, you *also* fix many possible future production bugs like the "Scroll to" bug from before:
1105
+
يساعدك Strict Mode على اكتشاف أخطاء callback refs مبكرًا. عندما تُصلح الـ callback بإضافة تنظيف في Strict Mode، *تُصلح* أيضًا أخطاء إنتاج محتملة كثيرة مثل خطأ «Scroll to» السابق:
1106
1106
1107
1107
<Sandpack>
1108
1108
@@ -1226,7 +1226,7 @@ li {
1226
1226
1227
1227
</Sandpack>
1228
1228
1229
-
Now on inital mount in StrictMode, the ref callbacks are all setup, cleaned up, and setup again:
1229
+
الآن عند التركيب الأول في StrictMode، تُستدعى استدعاءات الـ ref كلها: إعداد، ثم تنظيف، ثم إعداد مجددًا:
0 commit comments