تا حالا براتون پیش اومده بخواین بدونین پشتِ یه برنامه تحت وب، دقیقاً چی داره اتفاق میفته؟ مخصوصاً وقتی برنامه‌های بزرگ و پیچیده دارن کار می‌کنن و کلی کاربر همزمان دارن باهاشون کار می‌کنن! اینجا دقیقاً بحث “visualization” یا همون “بصری‌سازی” نرم‌افزاره که ما رو کمک می‌کنه تا بفهمیم سیستم چطور رفتار می‌کنه و کجاها داره چی کار می‌کنه.
حالا این ایده رو که اکثر نرم‌افزارهای امروزی کلی رابط کاربری تحت وب دارن، یعنی همون سایت‌هایی که ما جلوشون نشستیم و کلیک می‌کنیم، در نظر بگیر. جالبه بدونی معمولاً این قسمت‌های وب تو ابزارهای عرفِ visualization خیلی جدی گرفته نمیشن یا اصلاً دیده نمیشن، که خب خبراش خوشایند نیست.
ولی یه تیم باحالی اومدن و تو ابزارشون به اسم ExplorViz (یه ابزار آنلاین برای بصری‌سازی اجرا و رفتار برنامه‌های در حال کار)، بخش جدیدی اضافه کردن که خیلی کارو جذاب‌تر کرده. چی کار کردن؟ اومدن توی نمایش سه‌بعدی خودشون یه نمای وب (یعنی همون صفحه سایت برنامه) رو هم گذاشتن! یعنی همزمان می‌تونی تو سه‌بعدی حرکت کنی و صفحه‌ی وب رو ببینی. جالب‌تر اینه که میشه ساختار HTML ـی که توش داره نشون داده میشه رو هم به صورت سه‌بعدی ببینی!
یه توضیح کوچیک: “HTML” همون زبانیه که همه صفحات وب باهاش ساخته میشن، و “Document Object Model (DOM)” یا مدل شیء سند، همون ساختار درختی اطلاعات هر صفحه‌ست که به مرورگر میگه مثلاً این تیتره، این دکمه‌ست، این عکسِ فلان جاست و غیره. حالا اینا رو گذاشتن تو یه فضای سه‌بعدی تا بهتر بشه تحلیلش کرد.
این کار باعث میشه آدم راحت‌تر بتونه بفهمه دقیقاً کدوم قسمت‌های صفحه فعالن، چی به چی وصله و مثلاً با حرکت دادن موس و کلیک کردن، ببینه پشت هر جزء HTML چه کدی و چه رفتاری خوابیده – واقعاً جالبه!
تیم پژوهشی برای اینکه ببینن این ایده چقدر جواب میده، یه مطالعه اولیه روی کاربرا انجام دادن. تو این آزمایش نتایج جالبی به‌دست آوردن؛ مثل اینکه این روش خیلی می‌تونه کمک کنه آدمای تازه‌کار یا حتی حرفه‌ای که برنامه های تحت وب میسازن، ساختار صفحات رو بهتر بفهمن. البته یه سری ایراد و محدودیت هم تو راهشون بوده که تو مقاله بهش اشاره کردن.
حالا برنامه دارن که تحقیق و توسعه رو ادامه بدن و حتی موارد استفاده بیشتری براش پیدا کنن؛ مثلاً اینکه چطور همزمان کل شهر نرم‌افزاری (یعنی یه استعاره سه‌بعدی از کل اجزای برنامه) و ساختار صفحه‌ی وب رو ببینیم و بهتر مشکلات و روابطش رو تحلیل کنیم.
خلاصه، این داستان ExplorViz و بصری‌سازی سه‌بعدی ساختار HTML بود، که واقعاً داره کارو برای همه – مخصوصاً کسانی که تیم‌های بزرگ اپلیکیشن میسازن – آسون‌تر و کم‌دردسرتر می‌کنه. اگه دوست داشتی و میخوای ویدئوی دموی این پروژه رو هم ببینی، این لینکش: https://youtu.be/wBWKlbvzOOE
منبع: +
