فلش‌کارت‌های آموزشی تسلط حرفه‌ای بر ابزارهای توسعه‌دهنده مرورگر کروم جهت افزایش بهره‌وری و بهبود کارایی وب‌سایت‌ها

🎓 دوره آموزشی جامع

📚 اطلاعات دوره

عنوان دوره: دوره تسلط حرفه‌ای بر ابزارهای توسعه‌دهنده مرورگر کروم جهت افزایش بهره‌وری و بهبود کارایی وب‌سایت‌ها

موضوع کلی: توسعه و برنامه‌نویسی وب

موضوع میانی: ابزارهای تحلیل و بهینه‌سازی عملکرد وب‌سایت

📋 سرفصل‌های دوره

• 1. آشنایی با محیط و ساختار کلی Chrome DevTools
• 2. نحوه فعال‌سازی و شخصی‌سازی تنظیمات پنل توسعه‌دهنده
• 3. بررسی ساختار درختی DOM و ویرایش زنده عناصر صفحه
• 4. مدیریت و ویرایش استایل‌های CSS در پنل Elements
• 5. استفاده از ابزار Computed برای تحلیل مدل جعبه‌ای و ابعاد عناصر
• 6. کار با ابزار Inspect جهت شناسایی دقیق المان‌های رابط کاربری
• 7. دیباگ کردن کدهای جاوا اسکریپت با استفاده از Breakpoints
• 8. مدیریت و مانیتورینگ رویدادهای صفحه با Event Listeners
• 9. استفاده از کنسول برای ثبت خطاها و اجرای کدهای سریع
• 10. تکنیک‌های حرفه‌ای لاگ‌گیری در کنسول با استفاده از Console API
• 11. بررسی و تحلیل درخواست‌های شبکه در پنل Network
• 12. فیلتر کردن و دسته‌بندی منابع بارگذاری شده در شبکه
• 13. شناسایی گلوگاه‌های بارگذاری با استفاده از نمودار Waterfall
• 14. تحلیل عملکرد رندرینگ و فریم‌ریت در پنل Performance
• 15. استفاده از ابزار Lighthouse برای ارزیابی کیفیت و سئو وب‌سایت
• 16. بهینه‌سازی زمان بارگذاری اولیه با آنالیز Coverage
• 17. مدیریت حافظه و شناسایی نشت حافظه با پنل Memory
• 18. ذخیره‌سازی و مدیریت داده‌های محلی در پنل Application
• 19. کار با Local Storage و Session Storage در محیط مرورگر
• 20. بررسی کوکی‌ها و مدیریت امنیت نشست‌های کاربری
• 21. استفاده از پنل Sources برای مشاهده و ویرایش فایل‌های پروژه
• 22. تکنیک‌های دیباگ کردن کدهای ناهمگام و Promises
• 23. شبیه‌سازی شرایط مختلف شبکه در پنل Network Throttling
• 24. تست واکنش‌گرایی وب‌سایت با ابزار Device Mode
• 25. شبیه‌سازی سنسورها و شرایط محیطی دستگاه‌های همراه
• 26. استفاده از پنل Accessibility برای بررسی دسترسی‌پذیری سایت
• 27. شناسایی و رفع تضاد رنگ‌ها برای بهبود تجربه کاربری
• 28. کار با پنل Security برای بررسی وضعیت گواهینامه‌های امنیتی
• 29. بررسی وضعیت بارگذاری منابع با پنل Cache
• 30. استفاده از میانبرهای صفحه کلید برای افزایش سرعت توسعه
• 31. مدیریت و اشکال‌زدایی انیمیشن‌های CSS
• 32. تحلیل عملکرد اجرای اسکریپت‌ها با ابزار JavaScript Profiler
• 33. استفاده از Snippets برای اجرای کدهای تکراری و ابزارهای کمکی
• 34. تطبیق و ویرایش کدهای منبع با استفاده از Local Overrides
• 35. به‌کارگیری ابزارهای تحلیل CSS Grid و Flexbox
• 36. بررسی وضعیت بارگذاری فونت‌ها و بهینه‌سازی آن‌ها
• 37. تحلیل و کاهش حجم فایل‌های استاتیک در پنل Network
• 38. شناسایی اسکریپت‌های مسدودکننده رندر صفحه
• 39. مانیتورینگ تغییرات DOM در زمان اجرا با DOM Breakpoints
• 40. استفاده از قابلیت Live Expressions در کنسول برای مانیتورینگ متغیرها
• 41. بهینه‌سازی تصاویر و بررسی فرمت‌های بهینه در پنل Network
• 42. کار با ابزار Rendering برای مشاهده نواحی بازرسمی صفحه
• 43. تکنیک‌های حرفه‌ای در جستجوی فایل‌های پروژه در پنل Sources
• 44. بررسی و رفع خطاهای کنسول در محیط‌های عملیاتی
• 45. استفاده از ابزارهای جانبی و افزونه‌های هماهنگ با DevTools
• 46. روش‌های مستندسازی و خروجی گرفتن از گزارش‌های عملکرد
• 47. بهترین روش‌های تست و دیباگ در مرورگرهای پایه کرومیوم
• 48. تکنیک‌های پیشرفته در تحلیل کدهای پیچیده جاوا اسکریپت
• 49. اصول بهینه‌سازی تجربه کاربری بر اساس داده‌های DevTools
• 50. جمع‌بندی و استراتژی‌های حفظ بهره‌وری در توسعه وب