علی یگانه مقدم علی یگانه مقدم
مروری بر Blazor (قسمت اول)
اندازه‌ی قلم متن
تخمین مدت زمان مطالعه‌ی مطلب: سه دقیقه

Blazer یک فریمورک جدید تحت وب هست که این امکان را به برنامه نویسان دات نت میدهد تا از طریق Open Web Standards بتوانند کدهای خود را در مرورگر اجرا و تجربه جدیدی از ساخت برنامه‌های تک صفحه‌ای را داشته باشند. در این نوشتار قصد داریم ساختار و نحوه کارکرد این فناوری را بررسی نماییم. قبل از هر چیزی به دوران قبل از ایجاد Web Assembly برمی‌گردیم :

همانطور که در شکل زیر می‌بینید، زمانی تنها جاوااسکریپت فرمانروای یک مرورگر محسوب می‌شد. در این حالت کدهای جاوااسکریپت به هر شکلی که نوشته شده باشند در اختیار parser قرار میگیرند  و یک درخت از کدهای نوشته شده ایجاد شده و از طریق یک کامپایلر، کد‌ها به سطح پایین‌تری مشابه بایت کدها تبدیل می‌گردند و سپس از طریق یک مفسر دسترسی به بخش‌های مختلف api یک مرورگر در اختیار این کدها قرار میگیرند تا کار مورد نظر انجام شود.

 

در تصویر بعدی Web Assembly به بخش مفسر تزریق میشود و از طریق آن زبان‌های مختلف باید بر اساس Web Standard، به کدهای سطح‌های پایین‌تری کامپایل شوند. در اینجا این نکته مدنظر باشد که کدهایی که به سطح پایین‌تری کامپایل میشوند، تنها در داخل مرورگر شناخته شده میباشند و در خارج از دنیای وب قابل استفاده نیستند و نمیتوانند در سطح سیستم عامل قابل اجرا باشند. به همین جهت به شکل یک sandbox مورد استفاده قرار میگیرند و از این لحاظ، مشکلات امنیتی را در خارج از مرورگر ایجاد نمی‌کنند.

 

در شکل سوم Blazor که ترکیبی از نام Browser + Razor میباشد اضافه میشود. Blazor در اینجا وظیفه دارد محتوای فایل دریافتی را که شامل کدهای  HTML و  CSS و جاوااسکریپت است، به کدهای قابل فهمی برای مرورگر تبدیل کند. سپس mono وارد کار میشود. همانطور که می‌دانید mono جهت پشتیبانی از اجرای چندسکویی پروژه‌های دات نت اضافه شده که در اینجا هم همان وظیفه را منتها برای مرورگرهای مختلف، دارد. بدین جهت مونوی کامپایل شده بر روی Web Assembly قرار میگیرد تا کدهای دریافتی را تفسیر نماید. Blazor در اینجا dll‌های لازم را در mono بارگذاری میکند و سپس mono کدها را برای Web Assembly تفسیر میکند.

 

  اگر در تصویر بالا درقت کنید دو فایل Blazor.js و mono.js نیز وجود دارند که یک ارتباط به صورت Introp layer با Web Assembly برقرار کرده‌اند. البته در حال حاضر این ارتباط توسط Web Assembly پشتیبانی نمی‌شود. در صورت پیاده سازی و پشتیبانی Web Assembly از این بخش، میتوان با جاوااسکریپت هم با آن ارتباط برقرار کرد و یک ارتباط دو طرفه‌ای بین کدهای js و دات نت برقرار نمود؛ بدین صورت میتوان در دات نت توابع js را صدا زد و در js توابع دات نت صدا زده شوند.

همچنین مایکروسافت تنها به استفاده از Web Assembly اکتفا نکرده و از طریق SignalR نیز این  بستر را فراهم کرده است. با ایجاد یک سوکت به سمت سرور، تغییرات صفحه در سمت سرور، محاسبه و سپس بازگشت داده می‌شوند. در این حالت نیازی به ارسال فایل‌های dll نسبت به روش قبل نمی‌باشد. برای استفاده از این حالت میتوانید از بین گزینه‌های موجود در ایجاد پروژه، Blazor Server-side را مورد استفاده قرار دهید. البته این روش هم مزایا و معایب خودش را دارد.

جهت مقایسه این دو بخش به بررسی نکات مثبت و منفی میپردازیم:
1- در حالت استفاده از Web Assembly، حجمی حدود نزدیک به دو مگابایت بایدجابجا شود؛ ولی در حال سمت سرور، حجم صفحه حدود 100 کیلوبایت خواهد شد.
2- در حالت سمت سرور، تغییرات به دلیل رفت و برگشت به سرور با کمی تاخیر روبرو میشوند.
3- در حالت سمت سرور کارکرد آفلاین از دست میرود.
4- در حالت سرور، به دلیل اینکه همه کارها سمت سرور انجام میشود، ترافیک سرور را بالاتر میبرند.
5- استفاده از حالت سرور، معماری ساده‌تر و پیچیدگی‌های کمتری در سمت کلاینت دارد.
‫۵ سال و ۵ ماه قبل، جمعه ۱۶ فروردین ۱۳۹۸، ساعت ۲۳:۰۰
۴۲۳۳
۳
C#MonoBlazor
مطالب مشابه
  • #
    وحید کاوه وحید کاوه
    ‫۵ سال و ۵ ماه قبل، شنبه ۱۷ فروردین ۱۳۹۸، ساعت ۱۵:۵۵
    سلام 

    یک سوال برای من پیش اومده در این حالت Dll برنامه ما روی مرورگر کلاینت بارگذاری میشه؟
    اگه اینطوری باشه میتونن به سورس کد برنامه دسترسی داشته باشن برای این فکری شده؟
    • #
      محسن خان محسن خان
      ‫۵ سال و ۵ ماه قبل، شنبه ۱۷ فروردین ۱۳۹۸، ساعت ۱۶:۳۲
      به سورس کد برنامه‌های کلاینت تمام فریم‌ورک‌های SPA هم دسترسی وجود دارد؛ مانند Angular، React، Vue و غیره. سیلورلایت هم یک زمانی به همین صورت بود و می‌شد DLLهاش رو دریافت کرد. مهم هست؟! برای کارهای جاوااسکریپتی ابزارهای minification و uglification وجود دارند؛ برای کارهای دات نتی ابزارهای obfuscation.
    • #
      یاسر مرادی یاسر مرادی
      ‫۵ سال و ۵ ماه قبل، شنبه ۱۷ فروردین ۱۳۹۸، ساعت ۱۹:۰۳
      زمانی که از CSharp و به صورت کلی NET. استفاده می‌کنیم تا برای Android-iOS-Windows و جدیدا Web برنامه بنویسیم، این دغدغه ای که گفتید پیش میآد. علاوه بر راه هایی مثل Obfuscation که همیشه امکان استفاده شون هست، شما راه حل بهتری هم دارید و اون تبدیل کدتون به Native machine code هست که عملا مشکلی که گفتید رو نخواهد داشت و Performance خیلی خیلی خیلی بهتری هم می‌ده. توی Android و iOS این قابلیت در Xamarin دیده شده که اول Native Machine Code با قابلیتی به نام AOT یا Ahead of time به دست بیاد و یک دور هم با LLVM یا Low Level Virtual Machine بهینه سازی هم بشه. اون چیزی که شما به مشتری می‌دید دیگه DLL نیست و به هیچ روی چیز قابل فهمی هم داخل اش نیست. در برنامه‌های UWP می‌تونید از Dot Net Native استفاده کنید. در برنامه‌های WPF می‌تونید با پشتیبانی 3 NET Core. از اون، بیایید و خروجی کاملا Windows ای بگیرید که هم احتیاج به نصب بودن Dot Net یا Dot Net Core نداره و هم کدش خوانا نیست. توی Web Assembly هم همین هست، با پشتیبانی Mono از AOT که در مراحل اولیه قرار داره می‌تونید به سمت مرورگر فایل wasm بفرستید، نه dll، هم مشکلی که گفتید رو نداره و هم تا 70 برابر بسته به سناریو سرعت بیشتری داره.