۳ silence O
دلیل استفاه از object و parse کردن اونها در پروژه dark mode چیه؟ و مشکل در نمایش real time مقادیر ذخیره شده در local storage
جامعه وردپرس (برنامه نویسی) ایجاد شده در ۲۴ مرداد ۱۴۰۱

سلام و عرض ادب

2 تا سوال داشتم

1) برای پروژه Dark Mode ، به جای تعریف object و ذخیره آن در local storage(LS) و بازگرداندن اون‌ها با console.log ، فقط یک key , value درLS ذخیره کردم و بعد action‌ها رو به جای parse کردن به همون صورت عادی نوشتم که باعث شد نیازی به ذخیره کردن چند کلید و یا تعریف و ذخیره object نباشه . در کل اینجوری به نظر میاد که کدها کوتاه‌تر و ساده‌تر شدن و در ظاهر هم کار میکند

اگه میشه یه نگاهی به کدها بندازیدو راهنمایی کنید که روشی که رفتم درسته؟ جایی رو اشتباه نکردم؟ و اینکه چرا استاد از روشی که توی ویدیو هست استفاده کرده ؟ یعنی روش اصولی، درست و بهینه اینه؟

3abf-check it plz.jpg

2) توی ویدیو هر چیزی رو که استاد توی LS ذخیره میکرد، به صورت real time توی بخش LS مرورگر نمایش داده میشد و نیازی به refresh شدن نداشت. ولی من هر کلید و مقداری رو دستوری میدم ذخیره میشه ولی به صورت آنی نمایش نمیده و حتما باید بخش مربوط به LS در قسمت application رو refresh کنم تا مقادیری که ست کردم رو نمایش بده ( توی chrome و vivaldi و firefox تست کردم)

چطور میتونم این قضیه رو درست کنم؟

توی یه ویدیو کوتاه بخش تست کد‌ها و refresh کردن LS رو گذاشتم

سلام و احترام

1- روشی که شما استفاده کردید هیچ مشکلی ندارد و در اکثر کدنویسی‌های استاندارد قالب‌های دارای حالت روز و شب از همین حالت یعنی ذخیره یک کلید استفاده می‌شود، و نیازی به گرفتن استایل‌ها به صورت داینامیک وجود ندارد.

به فرض کلیدی تعریف می‌شود به نام theme_skin_mode و مقدار dark و یا light در آن قرار می‌گیرد.

ولیکن موارد زیر را برای بهتر شدن کد خودتان در نظر بگیرید.

-- هر چقدر بتوانید استایل هایی که به صورت addClass استفاده می‌کنید را کمتر کنید بهتر است یعنی فرضا به body کلاس darkmode را بدهید و باقی استایل دهی هارا توسط فایل‌های Css انجام دهید

.darkmode .contact_form { background: #000}

-- بهتر است شرط فعال بودن دارک مود را وابسته به چک باکس نکنید، یعنی دارک یا لایت بودن وابسته به متغییر localStorage باشد » اگر تعریف شده بود که حالت تاریک اگر نشد بود تم عادی باشد.( چک باکس بیشتر برای رابط کاربری است و شما اگر کدهای خودتان را وابسته به چک باکس کنید این مورد باید در تمامی صفحات شما اضافه شود ولی اگر وابسته به متغییر لوکال باشید نیازی به پیاده سازی چک باکس در تمامی صفحات سایتتان ندارید)

2- در مرورگر تست شد به صورت عادی به همین شکل است و ریلود LS به صورت لحظه ای نیست، احتمالا استاد اکستنشن یا تنظیمات خاصی را اضافه کرده اند » هر چند اهمیت زیادی ندارد و در زمانی که در حال دولوپ هستید فقط به این بخش نیاز خواهید داشت.

مجدد اگر استاد تاپیک را مطالعه کنند جواب سوال دوم شمارا خواهند داد.

امیدواریم مفید واقع شده باشد

بهنام مرادی ۲۴ مرداد ۱۴۰۱، ۲۱:۳۷

سلام مجدد و خدا قوت

ممنون از پاسختون

جواب اولتون 2 تا نکته داشت

در رابطه با نکته اول چک کردم و دیدم نکته جالبیه. اگه فقط یه کلاس به body بدم، بدون ایجاد کلاس‌های جدید و صرفا با انتخاب درست سلکتور‌ها میشه این بخش رو از طریق css پیش برد و از طرفی یه بخش بزرگی از کدهای js هم کم میشه و درنهایت هم توسعه دادن کدها آسون‌تر میشه و هم سایت زمان لود کمتری داره


نکته دوم رو نمیدونم درست متوجه شدم یا نه!

به نظرم الان هم شرط dark mode بودن وابسته به check نیست بلکه به LS وابسته است. که اگه کلیدی در LS وجود داشت باشه، تغییرات رو اعمال میکنه ...

و اینکه نوشتید اگه به چک باکس وابسته باشه باید این مورد رو به تمام صفخات اضافه کنیم، این رو هم متوجه نشدم!

مگه اینطور نیست که این سوئیچ dark mode به header سایت اضافه میشه و header معمولا توی تمام صفحات ثابته ؟

پس اضافه کردنش به تمام بخش‌های سایت چه لزومی داره؟

اگه منظورتون رو اشتباه متوجه شدم لطفا بیشتر توضیح بدید تا متوجه بشم


برای سوال دوم هم حرفتون درسته اهمیت زیادی نداره.

ولی خب هر چه آسون‌تر و سریعتر بهتر :)

پس بنده منتظر جواب این بخش میمونم


تشکر فراوان

silence O ۲۶ مرداد ۱۴۰۱، ۰۹:۳۳

با سلام مجدد

در ارتباط با چک باکس بله کدهای شما صحیح است و وابستگی درستی ایجاد کرده اید ولی برحسب تجربه ای که از مشاهده اشتباهات سایر دوستان به آن رسیده بودم به شما منتقل شد که مد نظرتان باشد.

در زمینه اضافه شدن ان به هدر نیز، بله همینطور هست ولیکن ممکن است شما صفحاتی از سایتتان را داشته باشید که دارای حالت دارک مود نباشد، اپ ها، iframe‌ها و صفحات مختلف دیگر » اگر وابستگی به چک باکس نداشته باشد کدهای JS شما به راحتی می‌توانید در ان صفحات چک باکس را حذف یا مخفی نمایید.

سوال دوم نیز سعی میشود به استاد منتقل شود تا ایشان این تاپیک را بررسی کنند.

با آرزوی موفقیت

بهترین پاسخ
بهنام مرادی ۲۷ مرداد ۱۴۰۱، ۰۸:۳۱