پرامپت کامپوننت React
یک پرامپت جامع برای ساخت کامپوننت React با TypeScript، قرارداد props، دسترسپذیری و تست رفتار؛ همراه با مراحل تأیید، دو نسخهٔ تکمیلی برای بازبینی و اجرای سریع، راهنمای استفاده و چکلیست کیفیت.
پکیج جامع ۶ پرامپت زنجیرهای برای ممیزی عمیق، تحلیل شاخصهای Core Web Vitals، بهینهسازی داراییهای فرانتاند، تنظیمات سرور و کش، و تدوین نقشه راه بهبود سرعت و کارایی فنی وبسایت.
## نقشهٔ پکیج پرامپتهای بهینهسازی سرعت سایت
این بستهٔ تخصصی از ۶ پرامپت پیوسته تشکیل شده است که همانند یک زنجیره مهندسی عملکرد وب (Web Performance Engineering) عمل میکنند. خروجی هر مرحله مستقیماً خوراک ورودی مرحله بعد است:
1. **پرامپت ۱: ممیزی دادههای خام و کالبدشکافی Core Web Vitals**
- وظیفه: خواندن دادههای ورودی کاربر از ابزارهایی نظیر PageSpeed Insights یا WebPageTest و شناسایی دقیق ریشه اختلال در شاخصهای LCP، INP، CLS، FCP و TTFB.
2. **پرامپت ۲: بازمهندسی منابع فرانتاند (JavaScript & CSS)**
- وظیفه: تمرکز بر کدهای مسدودکننده رندر، شکستن بستهها (Code Splitting)، حذف استایلها و اسکریپتهای بلااستفاده و استراتژی اجرای ناهمگام.
3. **پرامپت ۳: بهینهسازی داراییهای بصری، فونتها و مدیا**
- وظیفه: تعیین استراتژی فرمتهای نوین، اندازه ابعاد، بارگذاری تنبل هوشمند، و پاکسازی فلش محتوای بدون استایل (FOIT/FOUT).
4. **پرامپت ۴: تنظیمات سرور، پروتکلهای شبکه و معماری کش**
- وظیفه: کاهش تاخیر اتصال به سرور، بهینهسازی سربرگهای کش، بهرهگیری از CDN و مدیریت پیشواکشی (Prefetch/Preconnect).
5. **پرامپت ۵: اصلاح پایداری چیدمان بصری و تعاملپذیری (CLS & INP)**
- وظیفه: رفع جهشهای المانها، سبکسازی درخت DOM، و تفکیک کارهای سنگین در نخ اصلی (Main Thread).
6. **پرامپت ۶: تدوین نقشه راه اولویتبندیشده، سند بودجه عملکرد و سیستم مانیتورینگ**
- وظیفه: تبدیل همه نتایج به یک ماتریس زمانبندیشده، دستورالعمل استقرار و معیارهای ارزیابی مداوم کارایی.
---
## پرامپت شماره ۱: ممیزی دادههای خام و کالبدشکافی Core Web Vitals
### کاربرد و هدف
استخراج نقاط ضعف پنهان از گزارشهای تست عملکرد، تمایز میان دادههای میدانی (Field Data) و دادههای آزمایشگاهی (Lab Data)، و اولویتبندی چالشها بر مبنای شدت آسیب به تجربه کاربری.
### متن پرامپت برای کپی:
```markdown
تو یک مهندس ارشد بهینهسازی عملکرد وب (Web Performance Engineer) و مشاور تخصصی Core Web Vitals هستی. وظیفه داری دادههای عملکردی ارائه شده از وبسایت را تحلیل کنی و ریشههای فنی افت سرعت را با رویکردی مستند و بدون حدس و گمان استخراج نمایی.
## ورودیها
- آدرس وبسایت یا نوع صفحه: {{صفحه اصلی | صفحه محصول | صفحه فرود | وبلاگ}}
- پشته فنی و سیستم مدیریت محتوا: {{وردپرس | اختصاصی لاراول | ریاکت / نکستجیاس | ووکارمرس | پایتون جنگو | سایر}}
- دادههای شاخصهای آزمایشگاهی (Lab Data):
- First Contentful Paint (FCP): {{مقدار ثانیه}}
- Largest Contentful Paint (LCP): {{مقدار ثانیه}}
- Cumulative Layout Shift (CLS): {{مقدار عددی}}
- Total Blocking Time (TBT): {{مقدار میلیثانیه}}
- Time to First Byte (TTFB): {{مقدار میلیثانیه}}
- دادههای میدانی در صورت وجود (Field Data / CrUX):
- Interaction to Next Paint (INP): {{مقدار میلیثانیه یا نامشخص}}
- لیست خطاهای پرتکرار گزارش شده توسط ابزار (مانند PageSpeed یا لایتهاوس): {{متن یا لیست خطاها}}
- وضعیت شبکه و سرور: {{هاست اشتراکی | سرور مجازی اختصاصی | سرور ابری}}، منطقه سرور: {{ایران | خارج}}
[ادامهٔ پرامپت ۱، پرامپتهای ۲ تا ۶، راهنمای عیبیابی خروجیها و چکلیست کیفیت در نسخهٔ کامل آمده است.]
این بخش پیشنمایش رایگان است. متن کامل پرامپت پس از خرید در «کتابخانهٔ من» در دسترس شما قرار میگیرد.
کند بودن سرعت بارگذاری وبسایت یکی از دلایل اصلی افت نرخ تبدیل، افزایش نرخ پرش و تنزل تجربه کاربری است. با توجه به پیچیدگی معیارهای ارزیابی عملکرد و تنوع پشتههای فنی، شناسایی گلوگاههای اصلی بارگذاری نیازمند دانشی چندوجهی میان فرانتاند، بکاند و پیکربندی شبکه است.
این پکیج پرامپت زنجیرهای طراحی شده است تا وبمسترها، توسعهدهندگان و متخصصان سئو فنی بتوانند گامبهگام دادههای خام ابزارهای سنجش سرعت را تحلیل کرده، راهحلهای کدهای مسدودکننده، مشکلات رندرینگ، مدیاهای سنگین و ضعفهای سرور را استخراج و به یک برنامه عملیاتی قابل اجرا تبدیل کنند.
روش استفاده بسیار ساده است: دادههای گزارش ابزارهایی مانند پپجاسپید یا لایتهاوس را وارد پرامپت نخست میکنید و خروجی ساختاریافته هر مرحله را به عنوان بستر تحلیلی در پرامپت بعدی قرار میدهید تا در نهایت یک برنامه بهینهسازی جامع و بدون خطا دریافت نمایید.
برای ثبت نظر ابتدا وارد شوید.
هنوز نظری برای این محصول ثبت نشده است.
این محصول برای ChatGPT / GPT، Claude، Gemini ارائه شده است.
پس از پرداخت، متن کامل «پرامپت بهینهسازی سرعت سایت» و فایلهای همراه درجشده در همین صفحه در کتابخانه حساب کاربری فعال میشود.
دسترسی به محصول خریداریشده دائمی است و از کتابخانه حساب کاربری انجام میشود.
یک پرامپت جامع برای ساخت کامپوننت React با TypeScript، قرارداد props، دسترسپذیری و تست رفتار؛ همراه با مراحل تأیید، دو نسخهٔ تکمیلی برای بازبینی و اجرای سریع، راهنمای استفاده و چکلیست کیفیت.
پکیج جامع پرامپتهای زنجیرهای توسعه فرانتاند؛ شامل ۶ پرامپت تخصصی از معماری کامپوننت و کدنویسی پاک تا مدیریت حالت، تستنویسی، دسترسپذیری و بهینهسازی کارایی.
رایگان
مصاحبهگر سختگیر میشود، سؤال میپرسد و بعد از هر پاسخ بازخورد ساختاریافته میدهد.
مقالهٔ تخصصی را به خلاصهٔ لایهای تبدیل میکند: یک جمله، یک پاراگراف، یک صفحه.