با توابع جدید sibling-index() و sibling-count() آشنا شوید؛ دو قابلیت تازه در زبان CSS که نگاه توسعه‌دهندگان را به شمارش عناصر و چیدمان‌های ریاضی تغییر می‌دهد. این توابع برای نخستین بار امکان دسترسی به ایندکس هر عنصر در میان خواهرزادگانش و همچنین تعداد کل آن‌ها را مستقیماً درون استایل‌شیت فراهم می‌کنند.
یکی از جذاب‌ترین کاربردهای این توابع، ساخت افکت آبشاری پلکانی یا همان Staggered Cascade تنها در یک خط CSS است؛ چیزی که تا پیش از این نیازمند نوشتن قوانین متعدد :nth-child() یا استفاده از راه‌کارهای جاوااسکریپتی بود.
به گفته توسعه‌دهندگان، این رویکرد کاملاً مقیاس‌پذیر است؛ چه ۵ المان داشته باشید و چه ۵۰۰۰ المان، بدون افت عملکرد همان رفتار روان را ارائه می‌دهد. این ویژگی برای رابط‌های کاربری پویا مثل لیست‌های مجازی، گالری‌ها و انیمیشن‌های ورود یک نقطه عطف محسوب می‌شود.
به نقل از کدیرانتوابع sibling-index() و sibling-count() نشان‌دهنده یک تغییر فلسفی مهم در زبان CSS هستند؛ زبانی که سال‌ها برای پویایی به جاوااسکریپت متکی بود. تا پیش از این، برای ایجاد جلوه‌های متوالی روی لیستی از عناصر، توسعه‌دهندگان ناچار بودند یا قوانین متعدد :nth-child() را به صورت دستی بنویسند، یا با جاوااسکریپت ایندکس هر عنصر را محاسبه کرده و به صورت استایل اینلاین تزریق کنند. این رویکرد نه تنها کد را طولانی و مستعد خطا می‌کرد، بلکه با بزرگ شدن لیست‌ها به ۵۰۰۰ مورد و بیشتر، عملکرد صفحه را به شدت تحت فشار قرار می‌داد.
ورود این دو تابع به معنای در دسترس قرار گرفتن منطق ریاضی پویا در لایه استایل است. sibling-index() ایندکس هر عنصر را در زنجیره خواهرزادگانش برمی‌گرداند و sibling-count() مجموع تعداد آن‌ها را؛ ترکیب این دو امکان محاسبات نسبت‌سازانه‌ای را فراهم می‌کند که قبلاً غیرممکن بود؛ مثلاً تقسیم یک فاصله بر کل تعداد و توزیع یکنواخت آن در یک خط.
در نگاه کارشناسان کدیران، این پیشرفت ضمن اینکه تمرکز توسعه‌دهندگان را بیشتر به سمت CSS هدایت می‌کند، به کاهش حجم باندل جاوااسکریپت و بهبود زمان تعامل صفحه کمک خواهد کرد. انتظار می‌رود فریم‌ورک‌های مدرن و کتابخانه‌های انیمیشن به سرعت این توابع را جذب کنند و الگوهای رایجی مثل انیمیشن‌های آبشاری جایگزین کدهای دستی شوند. البته باید در نظر داشت که پشتیبانی مرورگرها در مراحل اولیه می‌تواند چالش موقتی باشد، اما با توجه به سابقه فازهای آزمایشی CSS در سال‌های اخیر، طی شدن این مسیر فقط مسأله زمان است.