سؤالات مصاحبه طراحی سیستم فرانت‌اند سطح سینیور (50 سؤال)

Question 1

برای infinite scroll مقیاس‌پذیر کدام مهم است؟

Accepted Answer

cursor pagination + virtualization + abort درخواست قدیمی

Answer

لود همزمان همهٔ میلیون‌ها ردیف در DOM

Answer

غیرفعال کردن cache همیشه

Answer

فقط `alert` برای هر آیتم

Question 2

برای offline-first یادداشت‌ها معمولاً چه ترکیبی لازم است؟

Accepted Answer

Service Worker + IndexedDB + صف sync

Answer

فقط sessionStorage بدون sync

Answer

فقط رنگ تم

Answer

حذف کامل persistence

Question 3

در داشبورد multi-tenant کدام حیاتی است؟

Accepted Answer

جداسازی داده و جلوگیری از نشت cache بین tenantها

Answer

اشتراک بی‌قید همه داده بین tenantها

Answer

حذف احراز هویت

Answer

فقط فونت یکسان

Question 4

در طراحی autocomplete، کدام مجموعه مهم‌تر است؟

Accepted Answer

debounce، cache نتایج، لغو درخواست قدیمی و a11y کیبورد (combobox)

Answer

fetch در هر keystroke بدون cache

Answer

لود همه داده‌ها در شروع اپ

Answer

فقط استایل dropdown

Question 5

پایه یک design system مقیاس‌پذیر بین چند تیم چیست؟

Accepted Answer

design tokens، نسخه‌بندی semver و مستندات/Storybook

Answer

کپی کامپوننت‌ها در هر پروژه

Answer

یک فایل CSS بزرگ بدون نسخه

Answer

استایل inline در همه جا

Question 6

مزیت Image CDN (مثل Cloudinary یا imgix) چیست؟

Accepted Answer

ریسایز و تبدیل فرمت (AVIF/WebP) روی edge بر اساس دستگاه

Answer

ذخیره دائمی در localStorage

Answer

حذف نیاز به `alt`

Answer

اجرای JS روی تصویر

Question 7

برای ویرایش هم‌زمان مثل Google Docs معمولاً از چه استفاده می‌شود؟

Accepted Answer

CRDT یا Operational Transformation

Answer

Last-write-wins روی کل سند

Answer

قفل کردن سند برای یک کاربر

Answer

polling هر یک دقیقه

Question 8

چرا داده RUM از Lighthouse آزمایشگاهی مهم‌تر است؟

Accepted Answer

تجربه واقعی کاربران روی دستگاه و شبکه واقعی را نشان می‌دهد

Answer

همیشه امتیاز بالاتری می‌دهد

Answer

نیازی به JS ندارد

Answer

فقط روی دسکتاپ اندازه می‌گیرد

Question 9

Content Security Policy (CSP) عمدتاً چه خطری را کاهش می‌دهد؟

Accepted Answer

XSS با محدود کردن منابع مجاز اسکریپت و غیره

Answer

CSRF به‌طور کامل

Answer

SQL injection

Answer

DDoS

Question 10

برای شخصی‌سازی صفحهٔ اصلی، تیم `Vary: Cookie` اضافه کرده و نرخ cache hit در CDN از ۹۵٪ به ۲٪ رسیده است. طراحی بهتر چیست؟

Accepted Answer

shell مشترک را cache کنید و بخش‌های شخصی را جداگانه (client یا edge) با کلید محدود بارگذاری کنید

Answer

TTL را به یک ثانیه کاهش دهید تا cache سریع‌تر پر شود

Answer

CDN را حذف کنید و همه را مستقیم از origin سرو کنید

Answer

`Vary: User-Agent` را هم اضافه کنید تا دقت بیشتر شود

Question 11

صفحهٔ پربازدید هر ۶۰ ثانیه از cache منقضی می‌شود و در همان لحظه هزاران درخواست هم‌زمان به origin می‌رسد و آن را از کار می‌اندازد. راه‌حل مناسب چیست؟

Accepted Answer

request collapsing در CDN همراه با `stale-while-revalidate` و origin shield

Answer

کاهش TTL به ۵ ثانیه تا بار پخش شود

Answer

غیرفعال کردن cache برای آن صفحه

Answer

افزودن retry فوری در کلاینت برای خطاهای 503

Question 12

در rolling deploy، کلاینت نسخهٔ قدیمی Server Action یا endpoint ای را صدا می‌زند که شکل payload آن در نسخهٔ جدید تغییر کرده است. رویکرد سیستماتیک چیست؟

Accepted Answer

قراردادهای سازگار با عقب (expand/contract) و مسیریابی آگاه از نسخه (skew protection)

Answer

deploy فقط نیمه‌شب تا کسی آنلاین نباشد

Answer

اجبار همهٔ کاربران به reload در هر ثانیه

Answer

حذف versioning و تغییر هم‌زمان کلاینت و سرور

Question 13

در micro-frontendها با Module Federation، دو remote نسخه‌های متفاوت React لود می‌کنند و hookها خطای «Invalid hook call» می‌دهند. ریشه و راه‌حل چیست؟

Accepted Answer

چند نمونهٔ React هم‌زمان؛ React را `singleton` با بازهٔ نسخهٔ سازگار share کنید و قرارداد نسخه داشته باشید

Answer

React باید در هر remote جداگانه bundle شود تا ایزوله باشد

Answer

hookها در micro-frontendها پشتیبانی نمی‌شوند

Answer

باید همهٔ remoteها را در یک iframe قرار داد

Question 14

در یک پلتفرم micro-frontend، استایل‌های global یک تیم دکمه‌های تیم دیگر را خراب می‌کند. کدام ترکیب پایدارتر است؟

Accepted Answer

CSS scoped (Modules یا prefix) یا `@layer`، ممنوعیت استایل global و design tokens مشترک

Answer

استفاده از `!important` روی همهٔ قوانین هر تیم

Answer

لود کردن CSS همهٔ تیم‌ها به ترتیب الفبایی

Answer

حذف کامل CSS و استایل‌دهی فقط با JavaScript inline

Question 15

سرویس WebSocket به ۲۰ نمونه مقیاس داده شده و کاربران متصل به نمونه‌های مختلف پیام‌های یک روم را دریافت نمی‌کنند. معماری درست چیست؟

Accepted Answer

یک backplane pub/sub (مثل Redis یا Kafka) که پیام را به همهٔ نمونه‌های دارای subscriber برساند

Answer

sticky session به تنهایی کافی است

Answer

تبدیل همهٔ کلاینت‌ها به polling هر ۱۰۰ms

Answer

محدود کردن سرویس به یک نمونه برای همیشه

Question 16

در اپ real-time با reconnect و retry، کاربران گاهی پیام تکراری یا خارج از ترتیب می‌بینند. کلاینت چگونه باید این را مدیریت کند؟

Accepted Answer

dedupe با شناسهٔ یکتای پیام و مرتب‌سازی بر اساس sequence اختصاص‌یافته توسط سرور

Answer

مرتب‌سازی بر اساس ساعت دستگاه هر کلاینت

Answer

نمایش پیام‌ها دقیقاً به ترتیب رسیدن

Answer

غیرفعال کردن retry برای جلوگیری از تکرار

Question 17

اپ offline-first برای حل تعارض از last-write-wins بر اساس `Date.now()` دستگاه استفاده می‌کند و داده‌ها گاهی گم می‌شوند. مشکل اصلی چیست؟

Accepted Answer

ساعت دستگاه‌ها قابل اعتماد نیست و LWW کل رکورد ویرایش‌های هم‌زمان را دور می‌ریزد

Answer

IndexedDB نمی‌تواند timestamp ذخیره کند

Answer

`Date.now()` در حالت offline کار نمی‌کند

Answer

سرور همیشه باید داده‌های کلاینت را رد کند

Question 18

درخواست `POST /payments` به دلیل timeout شبکه نامشخص ماند و کلاینت دوباره تلاش می‌کند. چگونه از پرداخت دوباره جلوگیری می‌شود؟

Accepted Answer

ارسال `Idempotency-Key` یکتا که سرور با آن نتیجهٔ درخواست قبلی را برمی‌گرداند

Answer

غیرفعال کردن دکمه به مدت ۵ ثانیه

Answer

تبدیل درخواست به `GET` تا idempotent شود

Answer

افزایش timeout به ۱۰ دقیقه

Question 19

داشبورد معاملات در ثانیه ۲۰۰۰ به‌روزرسانی قیمت دریافت و برای هر کدام setState می‌کند؛ UI قفل می‌شود. طراحی درست چیست؟

Accepted Answer

coalesce آخرین مقدار هر نماد در buffer و flush یک‌بار در هر فریم با `requestAnimationFrame`

Answer

افزودن `await` قبل از هر setState

Answer

ذخیرهٔ هر به‌روزرسانی در `localStorage`

Answer

باز کردن یک WebSocket جدا برای هر نماد

Question 20

کاربران اپ ایمیل معمولاً ۱۰ تب باز دارند و هر تب WebSocket خودش را باز می‌کند که بار سرور را ۱۰ برابر کرده است. راه‌حل سمت کلاینت چیست؟

Accepted Answer

leader election بین تب‌ها (مثل Web Locks) تا یک تب اتصال را نگه دارد و با `BroadcastChannel` پخش کند

Answer

بستن خودکار همهٔ تب‌ها به جز یکی

Answer

ذخیرهٔ اتصال WebSocket در `localStorage`

Answer

تبدیل اپ به polling در هر تب

Question 21

برای یک SPA بانکی که از OAuth/OIDC استفاده می‌کند، توصیهٔ امنیتی فعلی برای نگه‌داری tokenها چیست؟

Accepted Answer

الگوی BFF که tokenها را روی سرور نگه دارد و به مرورگر فقط cookie سشن HttpOnly بدهد

Answer

ذخیرهٔ access و refresh token در `localStorage` با رمزنگاری سمت کلاینت

Answer

استفاده از implicit flow و قرار دادن token در fragment آدرس

Answer

نگه‌داری refresh token در یک cookie غیر HttpOnly برای دسترسی JS

Question 22

PKCE در OAuth Authorization Code flow دقیقاً چه حمله‌ای را خنثی می‌کند؟

Accepted Answer

رهگیری authorization code و تبدیل آن به token توسط مهاجم

Answer

حملات XSS روی صفحهٔ callback

Answer

حدس زدن رمز عبور کاربر روی صفحهٔ لاگین

Answer

حملات DDoS روی authorization server

Question 23

CSP مبتنی بر allowlist دامنه‌ها (مثل `script-src https://cdn.example.com https://www.google.com`) چه ضعفی دارد و جایگزین بهتر چیست؟

Accepted Answer

endpointهای JSONP یا کتابخانه‌های قدیمی روی دامنهٔ مجاز امکان bypass می‌دهند؛ strict CSP با nonce یا hash و `strict-dynamic` بهتر است

Answer

allowlist هیچ ضعفی ندارد و بهترین روش است

Answer

باید `'unsafe-inline'` اضافه کرد تا امنیت بیشتر شود

Answer

CSP فقط در برابر CSRF مؤثر است و باید حذف شود

Question 24

در یک codebase بزرگ با صدها توسعه‌دهنده، Trusted Types چگونه به حذف DOM XSS کمک می‌کند؟

Accepted Answer

sinkهای خطرناک مثل `innerHTML` فقط شیء Trusted ساخته‌شده توسط policyهای بررسی‌شده را می‌پذیرند

Answer

همهٔ رشته‌ها را به‌طور خودکار رمزنگاری می‌کند

Answer

جلوی اجرای همهٔ اسکریپت‌های third-party را می‌گیرد

Answer

TypeScript را در زمان اجرا در مرورگر فعال می‌کند

Question 25

صفحهٔ checkout اسکریپت‌های analytics و chat third-party را لود می‌کند. بزرگ‌ترین ریسک و راه کاهش آن چیست؟

Accepted Answer

اسکریپت آلوده (Magecart) کارت را می‌دزدد؛ فیلدهای پرداخت را در iframe ایزوله از provider قرار دهید و اسکریپت‌های این صفحه را حداقل کنید

Answer

اسکریپت‌ها صفحه را کند می‌کنند؛ فقط آن‌ها را minify کنید

Answer

تنها ریسک، CLS ناشی از ویجت چت است

Answer

اسکریپت‌های third-party نمی‌توانند به DOM صفحه دسترسی داشته باشند

Question 26

سیستم از JWT بدون state با اعتبار ۲۴ ساعته استفاده می‌کند و پس از تغییر رمز یا مسدود کردن کاربر، دسترسی تا یک روز باقی می‌ماند. طراحی متعادل چیست؟

Accepted Answer

access token کوتاه‌عمر (چند دقیقه) همراه با refresh token قابل revoke در سرور

Answer

افزایش اعتبار JWT به یک هفته برای کاهش بار

Answer

بررسی دیتابیس فقط هنگام logout

Answer

حذف امضای JWT برای سرعت بیشتر

Question 27

پلتفرم آموزشی ویدیوهای پولی را از CDN سرو می‌کند و نمی‌خواهد هر درخواست برای auth به origin برود. رویکرد مناسب چیست؟

Accepted Answer

signed URL یا signed cookie با انقضای کوتاه که CDN در edge اعتبارسنجی کند

Answer

URL مخفی و طولانی بدون انقضا برای هر ویدیو

Answer

بررسی `Referer` به تنهایی

Answer

`Cache-Control: no-store` روی همهٔ ویدیوها

Question 28

کاربران از کندی صفحهٔ checkout شکایت دارند ولی متریک‌های هر سرویس بک‌اند نرمال است. چگونه مسیر کامل را از مرورگر تا دیتابیس دنبال می‌کنید؟

Accepted Answer

distributed tracing با OpenTelemetry و انتشار هدر `traceparent` از مرورگر به همهٔ سرویس‌ها

Answer

افزودن `console.log` در کد فرانت‌اند و درخواست اسکرین‌شات از کاربران

Answer

بررسی میانگین زمان پاسخ همهٔ endpointها

Answer

اجرای Lighthouse روی لپ‌تاپ توسعه‌دهنده

Question 29

میانگین LCP سایت ۱.۸ ثانیه است و تیم خوشحال است، ولی نرخ تبدیل در بازارهای نوظهور پایین است. تحلیل درست چیست؟

Accepted Answer

بررسی p75 و p95 به تفکیک کشور، دستگاه و نوع شبکه، چون میانگین دُم توزیع را پنهان می‌کند

Answer

میانگین معیار کافی است و مشکل از بازاریابی است

Answer

فقط داده‌های کاربران دسکتاپ را نگه دارید

Answer

داده‌های پرت را حذف کنید تا نمودار تمیز شود

Question 30

چگونه برای یک اپ فرانت‌اند SLO معنادار تعریف می‌کنید؟

Accepted Answer

بر اساس سفرهای حیاتی کاربر، مثلاً ۹۹.۵٪ checkoutها بدون خطا و p75 INP زیر ۲۰۰ms، همراه با error budget

Answer

uptime سرور استاتیک به تنهایی کافی است

Answer

تعداد خطوط کد تست‌شده

Answer

تعداد deployها در هفته

Question 31

سرویس «پیشنهادهای شخصی» در صفحهٔ محصول گاهی ۱۰ ثانیه timeout می‌شود و کل صفحه را معطل می‌کند. طراحی مقاوم چیست؟

Accepted Answer

وابستگی غیرحیاتی را با timeout کوتاه و circuit breaker جدا کنید و در خطا fallback (مثل پرفروش‌ها) نشان دهید

Answer

صفحه را تا پاسخ کامل همهٔ سرویس‌ها نگه دارید تا داده ناقص نباشد

Answer

timeout را به ۳۰ ثانیه افزایش دهید

Answer

در هر خطا ۵ بار پشت سر هم retry کنید

Question 32

feature flagها در کلاینت پس از لود صفحه از یک SDK دریافت می‌شوند. کدام دو مشکل اصلی ایجاد می‌شود؟

Accepted Answer

flicker/CLS هنگام تغییر UI پس از دریافت flag و نشت نام یا کد ویژگی‌های منتشرنشده در bundle

Answer

افزایش حجم دیتابیس و کندی DNS

Answer

غیرفعال شدن HTTP cache و از کار افتادن CORS

Answer

عدم امکان rollback و حذف نیاز به تست

Question 33

تیم رشد می‌خواهد A/B test روی صفحهٔ فرود پرترافیک اجرا کند بدون flicker و بدون از دست دادن cache CDN. طراحی مناسب چیست؟

Accepted Answer

تخصیص bucket در edge با cookie پایدار و cache جداگانهٔ هر variant با کلید محدود

Answer

اسکریپت A/B سمت کلاینت که پس از رندر DOM را تغییر دهد

Answer

SSR بدون cache برای همهٔ درخواست‌ها

Answer

مخفی کردن کل صفحه تا اجرای اسکریپت A/B

Question 34

یک design system باید ۵ برند با تم روشن و تیره را بدون fork کردن کامپوننت‌ها پشتیبانی کند. معماری مناسب چیست؟

Accepted Answer

لایه‌بندی tokenها (primitive ← semantic ← component) و اعمال آن‌ها با CSS custom properties در runtime

Answer

کپی کامپوننت‌ها برای هر برند در پکیج جدا

Answer

رنگ‌های hardcode شده با شرط `if (brand === ...)` در هر کامپوننت

Answer

build جداگانهٔ کل اپ برای هر ترکیب برند و تم

Question 35

سایت چندزبانه زبان را فقط از هدر `Accept-Language` تشخیص می‌دهد و همه زبان‌ها روی یک URL هستند. چه مشکلاتی دارد؟

Accepted Answer

cache CDN و ایندکس موتور جستجو مختل می‌شود؛ بهتر است locale در مسیر باشد (`/fa/...`) با `hreflang`

Answer

هیچ مشکلی ندارد و بهترین روش SEO است

Answer

فقط باعث کندی DNS می‌شود

Answer

مرورگرها هدر `Accept-Language` را ارسال نمی‌کنند

Question 36

چگونه مشکلات i18n (متن hardcode، بریده شدن متن‌های طولانی، RTL) را قبل از رسیدن ترجمه‌های واقعی در مقیاس بزرگ پیدا می‌کنید؟

Accepted Answer

pseudo-localization در CI و staging: متن‌های کشیده با کاراکترهای خاص و یک locale آزمایشی RTL

Answer

صبر تا گزارش کاربران پس از انتشار

Answer

ترجمهٔ ماشینی کل اپ در runtime

Answer

محدود کردن طول همهٔ متن‌ها به ۱۰ کاراکتر

Question 37

در یک SPA بزرگ، کاربران screen reader پس از ناوبری client-side متوجه تغییر صفحه نمی‌شوند. راه‌حل سیستمی در سطح router چیست؟

Accepted Answer

پس از هر تغییر route، فوکوس را به عنوان `<h1>` منتقل و عنوان را با یک live region اعلام کنید

Answer

افزودن `tabindex="1"` به همهٔ لینک‌ها

Answer

پخش صدای بوق پس از هر ناوبری

Answer

تبدیل همهٔ لینک‌ها به full page reload

Question 38

در سازمانی با ۲۰ تیم، هر تیم combobox و modal خودش را می‌سازد و ممیزی دسترس‌پذیری ده‌ها باگ تکراری پیدا کرده است. رویکرد مقیاس‌پذیر چیست؟

Accepted Answer

primitiveهای headless مشترک که الگوهای WAI-ARIA، فوکوس و کیبورد را یک بار درست پیاده کنند

Answer

ارسال لیست چک WCAG به هر تیم و امید به رعایت آن

Answer

افزودن `aria-label` به همهٔ المان‌ها به‌صورت خودکار

Answer

ممنوع کردن کامپوننت‌های تعاملی پیچیده

Question 39

یک chunk بزرگ `vendor.js` حاوی همهٔ وابستگی‌هاست و با هر به‌روزرسانی یک کتابخانهٔ کوچک، کاربران باید ۹۰۰KB را دوباره دانلود کنند. راهبرد بهتر چیست؟

Accepted Answer

granular chunking: تقسیم وابستگی‌ها به chunkهای پایدار و مشترک بر اساس استفاده، با hash محتوایی

Answer

ادغام همهٔ کد اپ و vendor در یک فایل واحد

Answer

تقسیم به هزاران فایل خیلی کوچک برای هر ماژول

Answer

غیرفعال کردن hash در نام فایل‌ها

Question 40

پردازش یک فایل ۲۰۰MB به Web Worker منتقل شده ولی main thread هنگام `postMessage` همچنان قفل می‌شود. علت و راه‌حل چیست؟

Accepted Answer

structured clone داده را کپی می‌کند؛ `ArrayBuffer` را به‌صورت transferable بفرستید تا مالکیت بدون کپی منتقل شود

Answer

Web Workerها همیشه روی main thread اجرا می‌شوند

Answer

باید داده را ابتدا به JSON رشته‌ای تبدیل کرد تا سریع‌تر شود

Answer

تعداد workerها را به ۱۰۰ افزایش دهید

Question 41

داشبورد مانیتورینگ روزها روی نمایشگرهای اتاق عملیات باز می‌ماند و پس از ۲ روز tab crash می‌کند. رویکرد تشخیص و پیشگیری چیست؟

Accepted Answer

مقایسهٔ heap snapshotها برای یافتن detached DOM، listenerها و subscriptionهای پاک‌نشده و محدود کردن bufferهای داده

Answer

افزایش RAM نمایشگرها

Answer

غیرفعال کردن garbage collector

Answer

تبدیل همهٔ نمودارها به تصاویر استاتیک

Question 42

پس از یک قطعی کوتاه API، میلیون‌ها کلاینت هم‌زمان retry می‌کنند و سرویس هنگام بازیابی دوباره از کار می‌افتد. کلاینت‌ها چه باید پیاده کنند؟

Accepted Answer

exponential backoff با full jitter، retry budget محدود و احترام به `Retry-After`

Answer

retry با فاصلهٔ ثابت دقیقاً ۵ ثانیه برای همه

Answer

retry نامحدود تا موفقیت

Answer

پاک کردن cache و reload کامل صفحه در هر خطا

Question 43

API عمومی GraphQL با queryهای بسیار عمیق و پرهزینه مورد سوءاستفاده قرار گرفته و cache CDN هم به خاطر POST بودن کار نمی‌کند. چه راه‌حلی هر دو مشکل را حل می‌کند؟

Accepted Answer

persisted queries (allowlist با hash) که با `GET` و شناسهٔ query ارسال و در CDN cache شوند

Answer

افزایش timeout سرور GraphQL

Answer

تبدیل همهٔ queryها به mutation

Answer

غیرفعال کردن introspection به تنهایی

Question 44

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

Accepted Answer

تغییرات فقط افزایشی در سرور و کلاینت‌های tolerant reader که فیلدها و enumهای ناشناخته را نادیده بگیرند

Answer

تغییر نام فیلدها در هر release برای تمیزی کد

Answer

اعتبارسنجی سخت‌گیرانه که با هر فیلد اضافه کلاینت را crash کند

Answer

حذف فوری endpointهای قدیمی پس از هر release

Question 45

یک Service Worker معیوب deploy شده که همهٔ درخواست‌ها را از cache قدیمی سرو می‌کند و کاربران به‌روزرسانی را نمی‌بینند. چگونه بازیابی می‌کنید؟

Accepted Answer

یک SW no-op در همان URL منتشر کنید که cacheها را پاک و خودش را unregister کند؛ اسکریپت SW نباید طولانی cache شود

Answer

تغییر URL فایل SW به `sw-v2.js` کافی است

Answer

از کاربران بخواهید cache مرورگر را دستی پاک کنند

Answer

دامنهٔ سایت را تغییر دهید

Question 46

کاربران ویدیوهای ۵GB را از شبکه‌های موبایل ناپایدار آپلود می‌کنند و آپلود از طریق سرور اپلیکیشن انجام می‌شود. طراحی بهتر چیست؟

Accepted Answer

آپلود مستقیم به object storage با presigned URL و multipart/resumable chunks

Answer

افزایش timeout سرور اپلیکیشن به ۲ ساعت

Answer

تبدیل فایل به base64 و ارسال در یک درخواست JSON

Answer

محدود کردن آپلود به شبکه‌های Wi-Fi

Question 47

تیم می‌خواهد با Speculation Rules API صفحات را prerender کند تا ناوبری فوری شود. مهم‌ترین trade-off چیست؟

Accepted Answer

هزینهٔ منابع و سرور برای صفحاتی که شاید باز نشوند، و اجرای زودهنگام analytics یا اقدامات جانبی

Answer

prerender باعث بدتر شدن LCP صفحهٔ مقصد می‌شود

Answer

این API فقط برای صفحات cross-origin کار می‌کند

Answer

prerender نیاز به Service Worker دارد

Question 48

چرا deployهای immutable و atomic (هر build با URL و assetهای خودش، و تعویض اشاره‌گر production) برای فرانت‌اند مقیاس‌بالا ارزشمندند؟

Accepted Answer

rollback فوری با برگرداندن اشاره‌گر و عدم وجود حالت نیمه‌deploy شده با assetهای مخلوط

Answer

حذف کامل نیاز به تست و QA

Answer

کاهش حجم JavaScript ارسالی به کاربر

Answer

امکان ویرایش مستقیم فایل‌ها روی سرور production

Question 49

origin اصلی فرانت‌اند در یک region قرار دارد و قطعی آن region کل سایت را از دسترس خارج می‌کند. ارزان‌ترین گام مؤثر برای افزایش availability چیست؟

Accepted Answer

origin failover در CDN به region یا bucket دوم و سرو محتوای کهنه با `stale-if-error`

Answer

افزایش اندازهٔ سرور در همان region

Answer

افزودن retry بیشتر در کلاینت

Answer

کاهش TTL همهٔ فایل‌ها به صفر

Question 50

bundle analyzer نشان می‌دهد سه نسخهٔ مختلف یک کتابخانهٔ تاریخ و دو نسخهٔ lodash در bundle هست. ریشه و راه‌حل پایدار چیست؟

Accepted Answer

بازه‌های نسخهٔ ناسازگار در وابستگی‌های transitive؛ dedupe با overrides/resolutions و بررسی duplicate در CI

Answer

مشکل از minifier است و باید آن را عوض کرد

Answer

tree-shaking به‌طور خودکار نسخه‌های تکراری را ادغام می‌کند

Answer

باید همهٔ وابستگی‌ها را در `devDependencies` قرار داد

طراحی سیستم فرانت‌اند · سینیور · 50

برای infinite scroll مقیاس‌پذیر کدام مهم است؟