Skip to content

PageFlow چگونه کار می‌کند

PageFlow کشف مسیر ویژهٔ هر فریم‌ورک را با یک کلاینت بصری مستقل از فریم‌ورک ترکیب می‌کند.

۱. کشف مسیرها

آداپتور انتخابی منبع مسیر فریم‌ورک را می‌خواند. Vue Router و Nuxt رکوردهای روتر را ارائه می‌کنند؛ فریم‌ورک‌های فایل‌محور مسیرها را از یکپارچه‌سازی build می‌دهند؛ React Router شیءهای مسیر می‌پذیرد؛ Next.js از sidecar توسعه استفاده می‌کند.

۲. آغاز runtime توسعه

افزونه فقط هنگام اجرای سرور توسعه یک runtime کوچک تزریق می‌کند. این runtime اطلاعات مسیر، مقصدهای ناوبری قابل مشاهده، عنوان صفحه و آمادگی را به endpointِ PageFlow گزارش می‌دهد.

۳. رندر صفحه‌های واقعی

PageFlow صفحه‌های هم‌مبدأ برنامه را در iframeهای کنترل‌شده باز می‌کند. صفحهٔ انتخابی زنده می‌ماند و صفحه‌های پس‌زمینه در حافظهٔ نهان محدود تصاویر ثبت می‌شوند.

۴. تشخیص ناوبری

آداپتورها پیوندهای پشتیبانی‌شدهٔ فریم‌ورک، لنگرهای هم‌مبدأ، تغییرات تاریخچه، مقصدهای صریح برنامه‌نویسی و راهنمای ناوبری را تشخیص می‌دهند. کلاینت این مقصدها را به یال‌های جهت‌دار گراف و نقاط فعال پیش‌نمایش تبدیل می‌کند.

۵. چیدمان گراف

LeaferJS بوم را رندر می‌کند. دسته‌های مسیر سلسله‌مراتب‌های بزرگ را کاهش می‌دهند، شاخص مکانی کار viewport را محدود می‌کند و چیدمان‌های بزرگ می‌توانند در Worker اجرا شوند.

buildهای تولید

PageFlow فقط برای توسعه است. endpointهای runtime و کلاینت بصری آن در خروجی تولید تزریق نمی‌شوند. بررسی خروجی تولید در مخزن این مرز را تأیید می‌کند.

مرز ایمنی

حالت پیش‌نمایش ناوبری لنگر و ارسال فرم را در frame کنترل‌شده مسدود می‌کند، اما عوارض مقداردهی اولیهٔ برنامه را متوقف نمی‌کند. از دادهٔ محلی یا آزمایشی استفاده کنید.

منتشرشده با مجوز MIT.