تاریخ انتشار: 13 نوامبر 2024
تصور کنید به یک ردپای عملکرد نگاه می کنید و می خواهید یک منطقه خاص را برجسته کنید، مانند طولانی ترین کار یا یک تکه غیر ضروری کار. شاید می خواستید برای مراجعات بعدی یادداشت برداری کنید یا یافته های خود را با یک همکار به اشتراک بگذارید. بهترین راه برای انجام این کار چیست؟
البته، چاپ کردن رد روی یک تکه کاغذ بزرگ و کشیدن دستی و نوشتن یادداشت های شما، یا استفاده از نرم افزارهای شخص ثالث برای کشیدن یادداشت بر روی یک اسکرین شات از یک ردیابی است! (البته این بهترین راه تا الان بود.)
به‌عنوان بخشی از تعهد تیم ما به ساده‌سازی گردش‌های کاری توسعه‌دهندگان ، ما هیجان‌زده هستیم که جایگزینی برای آن گزینه‌ها معرفی کنیم: توانایی اضافه کردن حاشیه‌نویسی مستقیماً به ردیابی در پانل عملکرد !
اکنون، می‌توانید ردیابی‌ها را در جای خود حاشیه‌نویسی کنید، آن حاشیه‌نویسی‌ها را به راحتی مرور کنید، و حتی آنها را مستقیماً در فایل ردیابی ذخیره کنید. این باعث می شود به اشتراک گذاری بینش های برجسته مانند ارسال یک فایل ساده باشد، در حالی که نیاز به ابزارهای خارجی یا راه حل ها را از بین می برد. حاشیه نویسی ها نه تنها می توانند به شما در عملکرد اشکال زدایی کمک کنند، بلکه به شما کمک می کنند تا سریعاً با همکار خود در یک صفحه قرار بگیرید، یا درک آنها را از آنچه در حال انجام است بدون جلو و عقب زیاد ارتقا دهید.
سه نوع حاشیه نویسی وجود دارد:
محدوده زمانی مشروح : برچسب زدن هر محدوده زمانی در جدول زمانی
ورودی های حاشیه نویسی : افزودن یک برچسب به هر ورودی در جدول زمانی
اتصالات ورودی : هر دو ورودی را با یک فلش به هم وصل می کنیم تا رابطه آنها را نشان دهیم
بیایید به هر نوع حاشیه نویسی و سناریوهایی که ممکن است زمانی که به کار می آیند در آنها قرار بگیرید، نگاهی بیاندازیم.
محدوده زمانی مشروح شده
یک گردش کار رایج در DevTools، ثبت یک ردیابی برای رفع اشکال یک تعامل کند است. نمای ردیابی در ابتدا ممکن است بسیار زیاد به نظر برسد، اما با بررسی کنترل‌کننده‌های رویداد خاص و پشته‌های تماس، شروع به ایجاد حس خواهد کرد. یکی از کارهایی که می‌توانید برای آسان‌تر کردن کار با نمای ردیابی انجام دهید، ایجاد حاشیه‌نویسی برای برچسب‌گذاری نحوه صرف زمان کلی است. بنابراین، برای مثال، حاشیه نویسی محدوده زمانی برای به روز رسانی معنادار رابط کاربری پس از تعامل با کاربر ممکن است مفید باشد.
برای حاشیه نویسی محدوده زمانی : Shift را نگه دارید و از ابتدای تعامل به سمت به روز رسانی رابط کاربری بکشید. پس از آن، یک برچسب برای ایجاد حاشیه نویسی تایپ کنید. اگر محدوده انتخابی درست نیست، قبل از تایپ کردن، آن را با کلیک کردن بر روی آن لغو کنید. یا برای ویرایش برچسب حاشیه نویسی، روی آن دوبار کلیک کنید. در این زمان نمی توانید محدوده زمانی یک حاشیه نویسی موجود را تنظیم کنید. اگر بازه زمانی نادرست است، حاشیه نویسی را حذف کنید و یک حاشیه جدید ایجاد کنید.
با این حاشیه‌نویسی، نگاه واضح‌تری به تمام کارهایی که باید قبل از تغییر قابل مشاهده توسط کاربر اتفاق بیفتد خواهید داشت، بنابراین می‌توانید اشکال‌زدایی خود را بر این اساس متمرکز کنید.
نوشته های حاشیه نویسی شده
برای واضح‌تر کردن تغییر قابل مشاهده برای کاربر، می‌توانید وظیفه‌ای را که مسئول انتقال است با یک برچسب ورودی حاشیه‌نویسی کنید.
برای ایجاد یک برچسب برای ورودی : روی ورودی انتخاب شده دوبار کلیک کنید و برچسب خود را تایپ کنید یا روی ورودی کلیک راست کرده و "ورود برچسب" را از منوی زمینه انتخاب کنید. برای ویرایش برچسب حاشیه نویسی، روی مدخل یا برچسب دوبار کلیک کنید. از طرف دیگر، گزینه "Entry برچسب" را از منوی زمینه انتخاب کنید.
با این حاشیه‌نویسی‌های ورودی، تشخیص اثری که برای تعامل مهم است (یا نیست) آسان‌تر است و اینکه چقدر زمان می‌برد.
اتصالات ورودی
سومین روشی که می‌توانیم ردیابی را حاشیه‌نویسی کنیم، ایجاد ارتباط بین تعامل و کار طولانی که مسئول انتقال است.
برای ایجاد ارتباط بین ورودی‌ها : روی ورودی که می‌خواهید به ورودی دیگری متصل شود دوبار کلیک کنید و روی فلشی که در سمت راست آن ورودی ظاهر می‌شود کلیک کنید. سپس، روی ورودی مورد نظر برای اتصال آن کلیک کنید. از طرف دیگر، روی ورودی کلیک راست کرده و از منوی زمینه ورودی، "مدخل پیوند" را انتخاب کنید.
بنابراین حتی اگر خود تعامل به پایان رسیده بود، می توانید از این نوع حاشیه نویسی استفاده کنید تا به وضوح نشان دهید که چگونه به کارهای طولانی بعدی متصل می شود که در نهایت رابط کاربری را مسدود می کند.
حاشیه نویسی ها را حذف و پنهان کنید
همه یادداشت ها را می توان به سرعت از نمای فهرست حاشیه نویسی در نوار کناری حذف کرد. نگه داشتن ماوس روی یک حاشیه نویسی نماد bin را نشان می دهد. برای حذف حاشیه نویسی روی این نماد کلیک کنید.
از طرف دیگر، برای حذف برچسب‌های ورودی و یادداشت‌های اتصال ورودی‌های مرتبط با یک رویداد خاص، روی رویداد کلیک راست کرده و "حذف حاشیه‌نویسی" را انتخاب کنید. حاشیه نویسی های دارای برچسب نیز می توانند با حذف برچسب و ذخیره حاشیه نویسی حذف شوند.
اگر می‌خواهید حاشیه‌نویسی‌ها را بدون حذف آنها پنهان کنید تا مزاحم کاوش در ردیابی نشوند، فقط کادر انتخاب «پنهان کردن حاشیه‌نویسی» را که در پایین نوار کناری حاشیه‌نویسی قرار دارد، علامت بزنید. این اولویت ذخیره خواهد شد. وقتی ردیابی را با حاشیه‌نویسی بارگیری می‌کنید در حالی که این تنظیم فعال است، حاشیه‌نویسی‌ها تا زمانی که کادر انتخاب را پاک نکنید، پنهان می‌مانند.
ردیابی های مشروح را ذخیره یا بارگیری کنید
عالی است، شما همه آن حاشیه نویسی را اضافه کردید تا به خود و دیگران کمک کنید تا ردیابی را درک کنند. بعدش چی؟
نیازی به گرفتن اسکرین شات از ردیابی نیست تا آنها را مانند زمان های قدیم، قبل از حاشیه نویسی برای همکار ارسال کنید. فقط فایل مشروح خود را ذخیره کنید و آن فایل را برای آنها ارسال کنید. تمام است—آنها می توانند فایل را در پانل عملکرد آپلود کنند و تمام حاشیه نویسی هایی که شما در زمینه ردیابی ایجاد کرده اید را ببینند، یا شاید حتی حاشیه نویسی های بیشتری اضافه کنند و آنها را برای شما ارسال کنند!
DevTools انواع دیگر سفارشی‌سازی‌ها را نیز در نمای ردیابی ذخیره می‌کند. برای مثال، می‌توانید با بزرگ‌نمایی و تنظیم یک خرده نان، یک ناحیه مورد علاقه را جدا کنید، یا ورودی‌ها را در پشته‌های تماس نامربوط پنهان کنید، و همه این تنظیمات توسط فایل ردیابی باقی می‌ماند، و همکاری در اشکال‌زدایی عملکرد را حتی آسان‌تر می‌کند. با تمام این سفارشی‌سازی‌ها، می‌توانید در حین ارائه متن کل و ردیابی تعاملی - برخلاف یک اسکرین‌شات، به آنچه بیشتر اهمیت دارد توجه کنید.
برای حفظ حاشیه نویسی ها و سایر سفارشی سازی ها، روی گزینه Save trace در زیر نماد دانلود کلیک کنید. هنگامی که یک ردیابی بارگیری می شود، شامل تمام آن سفارشی سازی ها می شود. ذخیره با حاشیه‌نویسی گزینه پیش‌فرض است، اما اگر می‌خواهید فقط فایل ردیابی خام را ذخیره کنید، گزینه Save trace without annotations را انتخاب کنید.
نتیجه گیری
این ممکن است به نظر اطلاعات زیادی برای جذب به نظر برسد، اما نگران نباشید! دستورالعمل های ایجاد حاشیه نویسی را همیشه می توان در برگه حاشیه نویسی نوار کناری پانل عملکرد یافت. این برگه دستورالعمل‌هایی را ارائه می‌کند که هیچ حاشیه‌نویسی وجود نداشته باشد، و پس از ایجاد، نمای فهرستی از حاشیه‌نویسی‌ها را نمایش می‌دهد.
دقیقاً مانند آن، حاشیه‌نویسی‌ها در پانل عملکرد به توسعه‌دهندگان این امکان را می‌دهد تا لحظات مهم را در یک ردیابی مشخص کنند و زمینه و بینش شخصی‌سازی شده را اضافه کنند. این فرآیند تجزیه و تحلیل را ساده می کند و اشتراک گذاری و همکاری در بهینه سازی عملکرد را آسان تر می کند. حاشیه نویسی ها را در پانل عملکرد امتحان کنید و نظر خود را با ما در میان بگذارید. اگر بازخوردی دارید، مایلیم نظرات شما را در شماره عمومی بخوانیم.
با نیاز به ابزارهای خارجی خداحافظی کنید و به گردش کار کارآمدتر سلام کنید!
،
تاریخ انتشار: 13 نوامبر 2024
تصور کنید به یک ردپای عملکرد نگاه می کنید و می خواهید یک منطقه خاص را برجسته کنید، مانند طولانی ترین کار یا یک تکه غیر ضروری کار. شاید می خواستید برای مراجعات بعدی یادداشت برداری کنید یا یافته های خود را با یک همکار به اشتراک بگذارید. بهترین راه برای انجام این کار چیست؟
البته، چاپ کردن رد روی یک تکه کاغذ بزرگ و کشیدن دستی و نوشتن یادداشت های شما، یا استفاده از نرم افزارهای شخص ثالث برای کشیدن یادداشت بر روی یک اسکرین شات از یک ردیابی است! (البته این بهترین راه تا الان بود.)
به‌عنوان بخشی از تعهد تیم ما به ساده‌سازی گردش‌های کاری توسعه‌دهندگان ، ما هیجان‌زده هستیم که جایگزینی برای آن گزینه‌ها معرفی کنیم: توانایی اضافه کردن حاشیه‌نویسی مستقیماً به ردیابی در پانل عملکرد !
اکنون، می‌توانید ردیابی‌ها را در جای خود حاشیه‌نویسی کنید، آن حاشیه‌نویسی‌ها را به راحتی مرور کنید، و حتی آنها را مستقیماً در فایل ردیابی ذخیره کنید. این باعث می شود به اشتراک گذاری بینش های برجسته مانند ارسال یک فایل ساده باشد، در حالی که نیاز به ابزارهای خارجی یا راه حل ها را از بین می برد. حاشیه نویسی ها نه تنها می توانند به شما در عملکرد اشکال زدایی کمک کنند، بلکه به شما کمک می کنند تا سریعاً با همکار خود در یک صفحه قرار بگیرید، یا درک آنها را از آنچه در حال انجام است بدون جلو و عقب زیاد ارتقا دهید.
سه نوع حاشیه نویسی وجود دارد:
محدوده زمانی مشروح : برچسب زدن هر محدوده زمانی در جدول زمانی
ورودی های حاشیه نویسی : افزودن یک برچسب به هر ورودی در جدول زمانی
اتصالات ورودی : هر دو ورودی را با یک فلش به هم وصل می کنیم تا رابطه آنها را نشان دهیم
بیایید به هر نوع حاشیه نویسی و سناریوهایی که ممکن است زمانی که به کار می آیند در آنها قرار بگیرید، نگاهی بیاندازیم.
محدوده زمانی مشروح
یک گردش کار رایج در DevTools، ثبت یک ردیابی برای رفع اشکال یک تعامل کند است. نمای ردیابی در ابتدا ممکن است بسیار زیاد به نظر برسد، اما با بررسی کنترل‌کننده‌های رویداد خاص و پشته‌های تماس، شروع به ایجاد حس خواهد کرد. یکی از کارهایی که می‌توانید برای آسان‌تر کردن کار با نمای ردیابی انجام دهید، ایجاد حاشیه‌نویسی برای برچسب‌گذاری نحوه صرف زمان کلی است. بنابراین، برای مثال، حاشیه نویسی محدوده زمانی برای به روز رسانی معنادار رابط کاربری پس از تعامل با کاربر ممکن است مفید باشد.
برای حاشیه نویسی محدوده زمانی : Shift را نگه دارید و از ابتدای تعامل به سمت به روز رسانی رابط کاربری بکشید. پس از آن، یک برچسب برای ایجاد حاشیه نویسی تایپ کنید. اگر محدوده انتخابی درست نیست، قبل از تایپ کردن، آن را با کلیک کردن بر روی آن لغو کنید. یا برای ویرایش برچسب حاشیه نویسی، روی آن دوبار کلیک کنید. در این زمان نمی توانید محدوده زمانی یک حاشیه نویسی موجود را تنظیم کنید. اگر بازه زمانی نادرست است، حاشیه نویسی را حذف کنید و یک حاشیه جدید ایجاد کنید.
با این حاشیه‌نویسی، نگاه واضح‌تری به تمام کارهایی که باید قبل از تغییر قابل مشاهده توسط کاربر اتفاق بیفتد خواهید داشت، بنابراین می‌توانید اشکال‌زدایی خود را بر این اساس متمرکز کنید.
نوشته های حاشیه نویسی شده
برای واضح‌تر کردن تغییر قابل مشاهده برای کاربر، می‌توانید وظیفه‌ای را که مسئول انتقال است با یک برچسب ورودی حاشیه‌نویسی کنید.
برای ایجاد یک برچسب برای ورودی : روی ورودی انتخاب شده دوبار کلیک کنید و برچسب خود را تایپ کنید یا روی ورودی کلیک راست کرده و "ورود برچسب" را از منوی زمینه انتخاب کنید. برای ویرایش برچسب حاشیه نویسی، روی مدخل یا برچسب دوبار کلیک کنید. از طرف دیگر، گزینه "Entry برچسب" را از منوی زمینه انتخاب کنید.
با این حاشیه‌نویسی‌های ورودی، تشخیص اثری که برای تعامل مهم است (یا نیست) آسان‌تر است و اینکه چقدر زمان می‌برد.
اتصالات ورودی
سومین روشی که می‌توانیم ردیابی را حاشیه‌نویسی کنیم، ایجاد ارتباط بین تعامل و کار طولانی که مسئول انتقال است.
برای ایجاد ارتباط بین ورودی‌ها : روی ورودی که می‌خواهید به ورودی دیگری متصل شود دوبار کلیک کنید و روی فلشی که در سمت راست آن ورودی ظاهر می‌شود کلیک کنید. سپس، روی ورودی مورد نظر برای اتصال آن کلیک کنید. از طرف دیگر، روی ورودی کلیک راست کرده و از منوی زمینه ورودی، "مدخل پیوند" را انتخاب کنید.
بنابراین حتی اگر خود تعامل به پایان رسیده بود، می توانید از این نوع حاشیه نویسی استفاده کنید تا به وضوح نشان دهید که چگونه به کارهای طولانی بعدی متصل می شود که در نهایت رابط کاربری را مسدود می کند.
حاشیه نویسی ها را حذف و پنهان کنید
همه یادداشت ها را می توان به سرعت از نمای فهرست حاشیه نویسی در نوار کناری حذف کرد. نگه داشتن ماوس روی یک حاشیه نویسی نماد bin را نشان می دهد. برای حذف حاشیه نویسی روی این نماد کلیک کنید.
از طرف دیگر، برای حذف برچسب‌های ورودی و یادداشت‌های اتصال ورودی‌های مرتبط با یک رویداد خاص، روی رویداد کلیک راست کرده و "حذف حاشیه‌نویسی" را انتخاب کنید. حاشیه نویسی های دارای برچسب نیز می توانند با حذف برچسب و ذخیره حاشیه نویسی حذف شوند.
اگر می‌خواهید حاشیه‌نویسی‌ها را بدون حذف آنها پنهان کنید تا مزاحم کاوش در ردیابی نشوند، فقط کادر انتخاب «پنهان کردن حاشیه‌نویسی» را که در پایین نوار کناری حاشیه‌نویسی قرار دارد، علامت بزنید. این اولویت ذخیره خواهد شد. وقتی ردیابی را با حاشیه‌نویسی بارگیری می‌کنید در حالی که این تنظیم فعال است، حاشیه‌نویسی‌ها تا زمانی که کادر انتخاب را پاک نکنید، پنهان می‌مانند.
ردیابی های مشروح را ذخیره یا بارگیری کنید
عالی است، شما همه آن حاشیه نویسی را اضافه کردید تا به خود و دیگران کمک کنید تا ردیابی را درک کنند. بعدش چی؟
نیازی به گرفتن اسکرین شات از ردیابی نیست تا آنها را مانند زمان های قدیم، قبل از حاشیه نویسی برای همکار ارسال کنید. فقط فایل مشروح خود را ذخیره کنید و آن فایل را برای آنها ارسال کنید. تمام است—آنها می توانند فایل را در پانل عملکرد آپلود کنند و تمام حاشیه نویسی هایی که شما در زمینه ردیابی ایجاد کرده اید را ببینند، یا شاید حتی حاشیه نویسی های بیشتری اضافه کنند و آنها را برای شما ارسال کنند!
DevTools انواع دیگر سفارشی‌سازی‌ها را نیز در نمای ردیابی ذخیره می‌کند. برای مثال، می‌توانید با بزرگ‌نمایی و تنظیم یک خرده نان، یک ناحیه مورد علاقه را جدا کنید، یا ورودی‌ها را در پشته‌های تماس نامربوط پنهان کنید، و همه این تنظیمات توسط فایل ردیابی باقی می‌ماند، و همکاری در اشکال‌زدایی عملکرد را حتی آسان‌تر می‌کند. با تمام این سفارشی‌سازی‌ها، می‌توانید در حین ارائه متن کل و ردیابی تعاملی - برخلاف یک اسکرین‌شات، به آنچه بیشتر اهمیت دارد توجه کنید.
برای حفظ حاشیه نویسی ها و سایر سفارشی سازی ها، روی گزینه Save trace در زیر نماد دانلود کلیک کنید. هنگامی که یک ردیابی بارگیری می شود، شامل تمام آن سفارشی سازی ها می شود. ذخیره با حاشیه‌نویسی گزینه پیش‌فرض است، اما اگر می‌خواهید فقط فایل ردیابی خام را ذخیره کنید، گزینه Save trace without annotations را انتخاب کنید.
نتیجه گیری
این ممکن است به نظر اطلاعات زیادی برای جذب به نظر برسد، اما نگران نباشید! دستورالعمل های ایجاد حاشیه نویسی را همیشه می توان در برگه حاشیه نویسی نوار کناری پانل عملکرد یافت. این برگه دستورالعمل‌هایی را ارائه می‌کند که هیچ حاشیه‌نویسی وجود نداشته باشد، و پس از ایجاد، نمای فهرستی از حاشیه‌نویسی‌ها را نمایش می‌دهد.
دقیقاً مانند آن، حاشیه‌نویسی‌ها در پانل عملکرد به توسعه‌دهندگان این امکان را می‌دهد تا لحظات مهم را در یک ردیابی مشخص کنند و زمینه و بینش شخصی‌سازی شده را اضافه کنند. این فرآیند تجزیه و تحلیل را ساده می کند و اشتراک گذاری و همکاری در بهینه سازی عملکرد را آسان تر می کند. حاشیه نویسی ها را در پانل عملکرد امتحان کنید و نظر خود را با ما در میان بگذارید. اگر بازخوردی دارید، مایلیم نظرات شما را در شماره عمومی بخوانیم.
با نیاز به ابزارهای خارجی خداحافظی کنید و به گردش کار کارآمدتر سلام کنید!