Book javascript fun

مشکل Performance که با یه خط HTML حل می‌شه

تا قبل از این، مرورگر خودش حدس می‌زد کدوم فایل مهم‌تره.
الان می‌تونی با fetchpriority صراحتاً بهش بگی چی زودتر لود بشه

حالا fetchpriority چیه؟
یه attribute ساده برای تعیین اولویت دریافت منابع (Image، Script و …)

مقادیر مهم:
مقدار high - خیلی مهمه (اول اینو دانلود کن)
مقدارlow - فعلاً مهم نیست
مقدار auto - تصمیم با مرورگر (پیش‌فرض)

کاربردهای واقعی:
میتونید مشخص کنید تصاویر اول صفحه زودتر لود بشن بعدا بره سراغ دانلود اسکریپت انالیز یا عکسای پایین صفحه

نتیجه؟
دارای LCP بهتر
لود سریع‌تر محتوای مهم
کنترل بیشتر روی Performance بدون JS اضافی

پشتیبانی مرورگرها:
همه مرورگرهای مدرن از ۲۰۲۳ به بعد

پرفورمنس Frontend فقط لایبرری نیست؛
گاهی یه attribute کوچیک، بیشترین تأثیر رو داره.

منبع:
https://backpackforlaravel.com/articles/tutorials/10-native-web-features-you-can-use-in-2026-you-probably-don-t-know-half-of-them

مدتی پیش روی یک پروژه ای به صورت فریلنسری کار میکردم که خیلی در رزومه کاریم بهش توجهی نداشتم الان تصمیم گرفتم این پروژه رو در لینکدین پست کنم و منتشرش کنم - پروژه متن بازه برای دریافت سورس پروژه و... پست لینکدین منو مشاهده کنید.

تکنولوژی های مورد استفاده :
html , tailwind , js , vite

لینک دمو

https://delbarbash.vercel.app/

@MahanZandiDev #Project@MahanZandiDev

دمت گرم ماهان نمونه کار عالی

کسانی که می خواهند نمونه کار فرانت اند بزنند این پیج در dribbble دنبال کنند https://dribbble.com/AmirAsadiUX

یه رود مپ خیلی خوب برای کسایی که میخوام تو مباحث فرانت عمیق بشن کانسپت های پایینه که بهتون دید خیلی خوبی توی فرانت میده و سعی کنین بلدش باشین تو مصاحبه ها ممکنه ازش سوال پرسیده بشه
Hydration
Partial hydration
Islands architecture
Streaming SSR
Concurrent rendering
Time slicing
Reconciliation algorithm
Fiber architecture
Virtual DOM diffing complexity
Structural sharing
Immutable data patterns
Referential equality
Memoization pitfalls
Stale closure problem
Event loop (macro vs microtasks)
Task starvation
Layout thrashing
Critical rendering path
Render blocking resources
Tree shaking internals
Code splitting strategies
Dynamic import chunking
Module federation
Shadow DOM
Custom Elements lifecycle
Web Components interoperability
Web Workers vs Service Workers
SharedArrayBuffer
Transferable objects
OffscreenCanvas
WebAssembly integration
Browser compositing layers
Paint vs composite vs layout
GPU acceleration in CSS
CSS containment
Subpixel rendering
IntersectionObserver internals
ResizeObserver loop limits
MutationObserver cost
IndexedDB
Service Worker lifecycle traps
Cache invalidation strategies
Stale-while-revalidate
ETag vs Cache-Control
HTTP/3 and QUIC
Priority hints
Preload vs Prefetch vs Preconnect
CORS preflight
SameSite cookie modes
CSRF vs XSS mitigation
Content Security Policy (CSP)
Trusted Types
DOM clobbering
Prototype pollution
Race conditions in UI state
Tearing in concurrent UI
Scheduler priorities
Render waterfalls
Suspense boundaries
Selective hydration
Server components
Edge rendering
Micro-frontend orchestration
Finite state modeling
Event sourcing in frontend
Optimistic UI rollback strategy
Offline conflict resolution
CRDT basics for collaboration
WebRTC
Backpressure in streams API
AbortController
Streaming fetch response handling
Browser memory leak detection
Detached DOM nodes
Garbage collection timing
PerformanceObserver API
Long tasks API
First Input Delay (FID)
Interaction to Next Paint (INP)
Cumulative Layout Shift (CLS)
Largest Contentful Paint (LCP)
Speculative prerendering
Priority inversion in async code
Deterministic rendering
Idempotent UI actions
Accessibility tree
ARIA live regions internals
Pointer events

حتما پیج اینستاگرام اقای پارسا قربانیان را دنبال کنید https://www.instagram.com/parsa_ghorbanian_web?igsh=NW1kd2Jpb2w0cW9t

کسانی که ادعا دارند مهندس نرم افزار هستند این پست من حتما بخوانند https://www.linkedin.com/posts/pooriavakili_%DA%86%D8%B1%D8%A7-%D9%87%DB%8C%DA%86-%D9%88%D9%82%D8%AA-%D9%85%D9%86-%D8%AE%D9%88%D8%AF%D9%85-%D9%85%D9%87%D9%86%D8%AF%D8%B3-%D9%86%D8%B1%D9%85-%D8%A7%D9%81%D8%B2%D8%A7%D8%B1-%D9%86%D9%85%DB%8C-%D8%AF%D9%88%D9%86%D9%85-activity-7428160987024891904-e-j5?utm_source=share&utm_medium=member_android&rcm=ACoAACp53lUBqtzJXugAy1KIey1OHh_KsiGvoo8

هم فارسی و انگلیسی این پست نوشتم