آموزش طراحی سایت فروشگاهی شخصی تجاری در بابل

طراحی حرفه ای سایت وب سازان شمال در بابل با پشتیبانی 24 ساعته و سئو بالا با متد gtmetrix

آموزش طراحی سایت فروشگاهی شخصی تجاری در بابل

طراحی حرفه ای سایت وب سازان شمال در بابل با پشتیبانی 24 ساعته و سئو بالا با متد gtmetrix

آموزش طراحی سایت فروشگاهی شخصی تجاری در بابل

بدون شک، برنامه نویسی یکی از مهم‌ترین مهارت‌هایی است که امروزه نه تنها برای فارغ التحصیلان و دانشجویان رشته مهندسی کامپیوتر، بلکه برای سایر رشته‌ها و زمینه‌ها کاربرد مهمی دارد .

چند نوع وب چیست؟

چهارشنبه, ۲۸ فروردين ۱۳۹۸، ۰۷:۰۰ ق.ظ

در توسعه وب، از جمله "برنامه وب"، "front-end "، "وب 2.0" و "برنامه های HTML5" از جمله مفاهیم گمراه کننده استفاده می شود که به نظر نمی رسد ویژگی های کامل اجرای و استفاده از معماری وب. امروز ما اطلاعات بیشتری در مورد انواع معماری وب را با توجه به آخرین روند وب و مسائل کلیدی که به صاحبان محصولات نرم افزاری مربوط می شود، خواهیم گفت.


ما می توانیم 3 نوع معماری اصلی وب را معرفی کنیم و مزایا و معایب آنها را مورد بحث قرار دهیم. ما می توانیم آنها را با توجه به سه دیدگاه ارزیابی کنیم: مالک نرم افزار، توسعه دهنده نرم افزار (عضو تیم اختصاص داده شده به پروژه) و کاربر نهایی. دیگر نمونه های احتمالی اساسا به این سه زیرمجموعه می رسند.


اول اجازه دهید یک برنامه وب را تعریف کنیم: این یک برنامه سرویس دهنده مشتری است، جایی که یک مرورگر (مشتری) و یک وب سرور وجود دارد. منطق یک برنامه وب در میان سرور و سرویس دهنده توزیع می شود، یک کانال برای تبادل اطلاعات وجود دارد و داده ها عمدتا بر روی سرور ذخیره می شوند. جزئیات بیشتر به معماری بستگی دارد: مکان های مختلف آن را به شیوه های مختلف قرار می دهند و توزیع می کنند.


سخت در مقایسه با معماری کاملا متفاوت بی طرفانه است. اما ما با استفاده از چند معیار ارزیابی سعی خواهیم کرد.


معیارهای کاربر


ریسپانسیو  قابلیت استفاده

به روز رسانی داده ها در صفحات، تغییر بین صفحات (زمان پاسخ). چنین ویژگی های رابط کاربر به عنوان غنی و intuitive.

پیوند دادن

توانایی ذخیره بوک مارک ها و لینک ها به بخش های مختلف وب سایت.


معیارهای توسعه دهنده


سرعت توسعه

معرفی ویژگی های جدید، طراحی، راه اندازی فرآیند توسعه نرم افزار.


کارایی

حداکثر سرعت پاسخ از سرور با حداقل مصرف توان محاسبات.


مقیاس پذیری

توانایی افزایش توان محاسبات یا فضای دیسک تحت افزایش میزان اطلاعات و یا تعداد کاربران. اگر یک سیستم مقیاس پذیر اختصاص داده شده استفاده شود، باید یکپارچگی داده، در دسترس بودن و تحمل پارتیشن (قضیه CAP) را ارائه دهد. همچنین لازم به ذکر است که مورد، زمانی که تعداد ویژگی ها صفحه نمایش برنامه مشتری در درخواست مالک مالکیت نرم افزار افزایش می یابد، به چارچوب و پیاده سازی بستگی دارد نه نوع معماری وب برنامه.


تست پذیری

امکان و سهولت تست واحد اتوماتیک.


معیارهای مالک نرم افزار محصول


قابلیت گسترش قابلیت

قابلیت های جدید در حداقل زمان و بودجه.

جستجوگرها

کاربران باید قادر باشند برنامه را از طریق هر موتور جستجو پیدا کنند.


حمایت کردن

علاوه بر برنامه نویسی مناسب، هزینه های اضافی نیز وجود دارد: سخت افزار، زیرساخت شبکه، تعمیر و نگهداری.


امنیت

صاحب نرم افزار باید مطمئن شود که داده های کسب و کار و اطلاعات مربوط به کاربران امن هستند. به عنوان معیار اصلی امنیت ما امکان تغییر در عملکرد رفتار برنامه در طرف مشتری و تمامی خطرات مرتبط را در نظر می گیریم. خطرات استاندارد برای معماری مقایسه شده است. ما امنیت را در کانال سرورسرویس گیرنده در نظر نمی گیریم، زیرا تمام این معماری ها به همان اندازه در معرض انفجار هستند. این کانال می تواند همان باشد.


تبدیل: وب سایت  برنامه موبایل یا دسکتاپ

تبدیل به یک برنامه موبایل یا دسکتاپ با حداقل هزینه های اضافی.


برخی از این معیارها ممکن است نادرست به نظر برسد اما هدف مقاله این نیست که نشان دهد چه چیزی خوب است و چه بد است. این یک بررسی دقیق است که گزینه های احتمالی را نشان می دهد.


بیایید سه نوع اصلی از برنامه های مبتنی بر وب را با توجه به نقش های انجام شده توسط سرور و مرورگر مشتری مشخص کنیم.


نوع 1: برنامه وب HTML سمت سرور


معماری نرم افزار وب گسترده ترین. سرور محتوای HTML را تولید می کند و آن را به عنوان یک صفحه کامل HTML به مشتری می فرستد. گاهی اوقات این معماری به نام '' وب 1.0 '' شناخته می شود، از آنجایی که اولین بار به نظر می رسید و در حال حاضر در حوزه توسعه وب حاکم است


ریسپانسیو قابلیت استفاده: 1/5. حداقل ارزش بهینه در میان این نمونه های معماری. مقدار زیادی داده بین سرور و سرویس گیرنده منتقل می شود. کاربر باید منتظر بماند تا کل صفحه دوباره بارگذاری شود، به عنوان مثال در پاسخ به اقدامات ناخوشایند، زمانی که فقط بخشی از صفحه نیاز به بارگیری دارد. قالب های UI در سرویس گیرنده مستقیما در چارچوب های اعمال شده بر روی سرور بستگی دارد. با توجه به محدودیت های اینترنت تلفن همراه و مقدار زیادی داده های منتقل شده، این معماری در بخش تلفن همراه به سختی قابل اجرا است. هیچ وسیله ای برای ارسال بروزرسانی داده های فوری یا تغییرات در زمان واقعی وجود ندارد. اگر ما امکان به روز رسانی در زمان واقعی را از طریق تولید بخش های آماده محتوای در سمت سرور و به روز رسانی مشتری (از طریق AJAX، WebSockets)، به علاوه طراحی با تغییرات جزئی در یک صفحه، معماری.



ارتباط پذیری: 5/5. بالاترین سه از آن، از آن است که ساده ترین قابل اجرا است. به دلیل این واقعیت است که به طور پیش فرض یک URL خاص محتوای HTML را بر روی سرور دریافت می کند.



جستجوگرها: 5/5. به راحتی اجرا می شود، همانند معیار قبلی. محتوای قبل از آن شناخته شده است.



سرعت توسعه: 5/5. این قدیمی ترین معماری در توسعه وب است، بنابراین امکان انتخاب هر زبان و چارچوب سرور برای نیازهای خاص وجود دارد.



مقیاس پذیری: 4/5. اگر نگاهی به نسل HTML بیاندازیم، تحت بار افزایش می یابد لحظه ای که توازن بار نیاز است. یک وضعیت بسیار پیچیده با پایگاه داده های مقیاس وجود دارد، اما این کار برای این سه نمونه معماری نرم افزاری مشابه است.



عملکرد: 3/5. به شدت به پاسخگویی و مقیاس پذیری متعهد است. عملکرد نسبتا کم است، زیرا مقدار زیادی داده باید منتقل شود، حاوی اطلاعات HTML، طراحی و کسب و کار باشد. بنابراین لازم است که داده ها را برای کل صفحه (نه فقط برای داده های کسب و کار تغییر یافته) و تمام اطلاعات همراه (مانند طراحی) تولید کنیم.



تداوم پذیری: 4/5. چیز خوبی است که نیازی به ابزار خاصی نیست که تفسیر جاوا اسکریپت را پشتیبانی می کند، برای جلوگیری از تست، و محتوای استاتیک است.



امنیت: 4/5. منطق رفتار برنامه در سمت سرور است. با این حال، داده ها به صورت آشکار منتقل می شوند، بنابراین ممکن است کانال محافظت شده مورد نیاز باشد (که اساسا یک داستان از هر معماری مربوط به سرور است). تمام قابلیت های امنیتی در سمت سرور است.



تبدیل: وب سایت - برنامه موبایل یا دسکتاپ: 0/5. در اکثر موارد این کار غیرممکن است. به ندرت یک استثنا وجود دارد (بیشتر از موارد اضطراب): برای مثال، اگر سرور بر روی node.js تحقق یابد، پایگاه های بزرگ زیادی وجود ندارد؛ یا اگر یکی از سرویسهای شخص ثالث برای کسب اطلاعات استفاده کند (با این حال، این نوع معماری پیچیده تر از معماری است). بنابراین می توان برنامه را در node-webkit یا معادل آن مشابه قرار داد.



کار آفلاین: 2/5. با یک آگهی در سرور وارد شده است که به مشخصات HTML5 وارد شده است. اگر مرورگر چنین مشخصاتی را پشتیبانی می کند، تمام صفحات برنامه ذخیره می شود: اگر اتصال قطع شود، کاربر یک صفحه ذخیره شده را مشاهده می کند.


نوع 2: ویدجت تولید JS (AJAX)


این یک معماری تکامل یافته از نوع اول است. تفاوت این است که صفحه، که در مرورگر نمایش داده می شود، شامل ویدجت (واحدهای مستقل عملکردی) می شود. به عنوان یک قطعه کامل از HTML، و یا به عنوان JSON، و تبدیل (از طریق قالب جاوا اسکریپت / اتصال) یا به محتوای صفحه: داده ها به این ویدجت طریق پرس و جو آژاکس از سرور آپلود می شوند. گزینه بارگذاری تکه های HTML از ضرورت استفاده از چارچوب JavaScript-MV * بر روی طرف مشتری اجتناب می کند؛ در این مورد می توان از چیزی ساده تر استفاده کرد (به عنوان مثال، jQuery). با کاهش تعامل، سرعت پیشرفت ما را افزایش می دهد و عملکرد را ارزان تر و قابل اعتماد تر می کند.



مزیت اصلی این است که به روز رسانی از سرور تنها برای بخشی از صفحه درخواست شده توسط مشتری وارد می شود. همچنین خوب است که ویجت ها به طور عملی از هم جدا شده اند. یک ویجت خاص مسئول یک قسمت از صفحه است؛ تغییرات جزئی بر کل صفحه تاثیر نمی گذارد.



پاسخگویی / قابل استفاده بودن: 3/5. حجم داده های منتقل شده برای یک قسمت از صفحه کوچکتر از کل صفحه است، به همین دلیل پاسخگویی بالاتر است. اما از آنجا که یک صفحه مجموعه ای از ویجت ها است، قالب های UI قابل استفاده در یک برنامه وب توسط چارچوب UI انتخاب شده محدود می شود. شروع سرد (اولین بار کامل) چنین صفحهای طول خواهد کشید. محتوا که به طور کامل بر روی سرور ایجاد شده و ذخیره می شود، می تواند بلافاصله بر روی مشتری نمایش داده شود؛ در اینجا وقت صرف می شود برای داده ها برای ویجت و، به عنوان یک قاعده، در قالب. در اولین بازدید وب سایت به سرعت بارگذاری نخواهد شد، اما در مقایسه با سایتهای مبتنی بر معماری نوع اول، بیشتر از آن لذت بخش خواهد بود. همچنین لازم به ذکر است که امکان اجرای بارگذاری "جزئی" (مانند آن در yahoo.com انجام می شود).



پیوند دادن: 2/5. در اینجا ابزار و مکانیزم خاصی مورد نیاز است. به عنوان یک قانون، مکانیزم هش بنگ اعمال می شود.



جستجوگرها: 2/5. مکانیزم های خاصی برای این وظایف وجود دارد. به عنوان مثال، برای ارتقاء وب سایت های مبتنی بر این معماری، می توان لیست لیست های تبلیغ شده را پیش از تعریف و URL های استاتیک برای آنها، بدون پارامترها و اصلاح کنندگان ایجاد کرد.



سرعت توسعه: 3/5. نیاز به دانستن فن آوری های سمت سرور در توسعه وب و استفاده از چارچوب های جاوا اسکریپت در سمت سرویس گیرنده است. همچنین لازم است که خدمات وب را در سمت سرور پیاده سازی کنید.


عملکرد: 4/5. زمان و منابع صرف شده برای تولید محتوای HTML نسبتا جزئی در مقایسه با زمان صرف شده توسط برنامه در بازیابی داده ها از پایگاه داده ها و پردازش آنها قبل از قالب است. استفاده از نوع گسترده این معماری (زمانی که داده ها به عنوان JSON منتقل می شوند) ترافیک بین مشتری و سرور را کاهش می دهد، یک سطح انتزاعی به برنامه اضافه می کند: بازیابی از پایگاه داده -> پردازش داده ها، سریال در JSON -> API: JSON -> تجزیه JSON -> اتصال شیء داده به مشتری به HTML.


مقیاس پذیری: 4/5. همانند نوع اول معماری.


تست پذیری: 1/5. این مورد نیاز به آزمایش طرف سرور، کد مشتری و سرویس وب است که داده ها را برای به روز رسانی ویدجت ها باز می گرداند.


امنیت: 4/5. بخشی از منطق به جاوا اسکریپت کلاینت منتقل می شود که می تواند توسط یک مزاحم تغییر کند.


تبدیل: وب سایت - برنامه موبایل یا دسکتاپ: 0/5. همانند نوع اول معماری.


کار آفلاین: 1/5. مکانیزم آشکارساز در این مورد کار می کند، اما با بروزرسانی یا ذخیره اطلاعات موجود در ویجت مشکل وجود دارد. این قابلیت باید علاوه بر این اجرا شود: در آشکارساز می تواند تنها نام فایل هایی را که از سرور ذخیره می شوند نشان دهد. همبستگی بین فایل قالب ویجت، ذخیره سازی در منوی، و منطق رفتار صفحه، نیازمند تلاش بیشتر است.


نوع 3: برنامه های وب یکپارچه سرویس گرا (وب 2.0، برنامه های HTML5)


اصطلاح "وب 2.0" در اینجا کاملا درست نیست. یکی از ویژگی های وب 2.0، اصل استفاده کاربران در پرکردن و مرتب سازی محتوای مکرر است. اساسا واژه "وب 2.0" به معنای پروژه ها و خدمات است که به طور فعال توسط خود کاربران توسعه می یابد: وبلاگ ها، ویکی ها، شبکه های اجتماعی. به این معناست که وب 2.0 به یک تکنولوژی یا مجموعه ای از تکنولوژی ها وابسته نیست.


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


در توسعه وب مدرن، برنامه های کاملا جاوا اسکریپت جاوا اسکریپت نادر هستند (با چند استثناء، مثلا rad-js.com). این روش اجازه می دهد تا به راحتی تبدیل معکوس: انتشار یک برنامه موجود در وب.


ریسپانسیو  قابلیت استفاده: 5/5. حجم داده های منتقل شده برای به روز رسانی حداقل است. به همین دلیل پاسخگویی در بالاترین سطح است. UI از طریق جاوا اسکریپت ایجاد می شود، ممکن است هر گونه تغییرات لازم را اجرا کند. یک مسئله در مورد multithreading در جاوا اسکریپت وجود دارد: در این مورد خاص پردازش حجم زیادی از اطلاعات کسب و کار باید به سرویس وب منتقل شود.



پیوند دادن: 1/5. یکی از ابزارها و مکانیسم های ویژه و همچنین چارچوب هایی می تواند به عنوان مثال، مکانیزم هش بنگ استفاده شود.


جستجوگرها: 1/5. سخت ترین برای ترویج اگر کل برنامه به طور مستقیم ارتقا یابد، هیچ مشکلی وجود ندارد: امکان ارتقاء ظرفیت برنامه وجود دارد. اگر برای یک بخشی از برنامه مورد نیاز است، برای این منظور یک مکانیسم خاص مورد نیاز است. هر موتور جستجوی بیشتر یا کمتر، روشهای استاندارد خود را برای این فرایند ارائه می دهد.


سرعت توسعه: 2/5. این نیاز به توسعه یک سرویس وب و کاربرد چارچوب های ویژه ی جاوا اسکریپت است که معماری برنامه را ایجاد می کنند. از آنجایی که معماری نسبتا جدید است، متخصصان زیادی وجود ندارند که بتوانند سایت / سیستم با کیفیت بالا را بر اساس این رویکرد ایجاد کنند. بسیاری از ابزارها، چارچوب ها و رویکردهای زمان سنجی وجود ندارد.


عملکرد: 5/5. این معیار حداقل بر طرف سرور تاثیر می گذارد. سرور فقط باید برنامه جاوا اسکریپت را به مرورگر بدهد. در سمت سرویس گیرنده، عملکرد و نوع مرورگر از اهمیت زیادی برخوردار است.


مقیاس پذیری: 5/5. منطق وب در سمت سرویس گیرنده است. هیچ تولیدی در سرور وجود ندارد. هنگامی که تعدادی از کاربران افزایش می یابند، لازم است که فقط خدمات وب را که داده های کسب و کار را می دهند، مقیاس بندی کنند.


تداوم پذیری: 3/5. این مورد برای آزمایش خدمات وب و کد جاوا اسکریپت مورد نیاز است.


امنیت: 0/5. این منطق به جاوا اسکریپت کلاستر منتقل می شود، که می تواند به راحتی توسط یک مزاحم تغییر کند. برای سیستم های محافظت شده لازم است که یک معماری پیشگیرانه ایجاد شود که ویژگی های برنامه های منبع باز را در نظر می گیرد.


تبدیل: وب سایت  برنامه موبایل یا دسکتاپ: 5/5. یک وبسایت با استفاده از PhoneGap یا یک پلت فرم مشابه می شود.



کار آفلاین: 5/5. این معماری یک برنامه کامل است؛ ممکن است داده های جداگانه و همچنین قسمت های برنامه را با استفاده از هر حافظه (مثلا ذخیره سازی محلی) ذخیره کنید. یکی دیگر از مزیت این است که امکان تغییر ذخیره داده ها و مدیریت داده ها به حالت آفلاین. برای مقایسه، دو معماری ذکر شده در حالت آفلاین تنها تا حدی کاربردی هستند. در اینجا داده های گمشده با mocks جایگزین می شوند، امکان نمایش پنجره های هشدار یا استفاده از داده ها از ذخیره سازی محلی وجود دارد، در حالیکه همگام سازی ممکن است برای بعد باقی بماند.


نظرات  (۴)

  • اشکان ارشادی
  • سلام 
    سایت خیلی کنده. زیاد از کد ابزار استفاده کردی اصلا سرعت نداره.
    دنبال میکنید.
    موفق باشی.
    پاسخ:
    سلام چی کنده؟؟
  • اشکان ارشادی
  • سلام 
    الان ما که داخل سایت نظر میگذاریم ، کنده کوند ، یعنی وبسایت به سختی لود میشه و......
    دنبالم کنید ، ممنون 
    انتخاب با شماست و میدانم اجباری نیست 
    خیلی کُنده. به سختی نوشتم.
    الان ده دقیقه........ از حجم کدها کم کن و یا مشکل چیه؟ نمیدانم 
    در وبم بپرس ، اینجا خیلی کنده.
  • اشکان ارشادی
  • سلام 
    اینجوری نمیشه ، از سایت شما بازدید کرد.
    خیلی کنده.
    در وبم بنویسید 
  • اشکان ارشادی
  • سلام 
    برایتان پاسخ نوشتم ، سوال داشتید در وبم بنویسید تا جواب دهم.
    موفق باشی.

    ارسال نظر

    ارسال نظر آزاد است، اما اگر قبلا در بیان ثبت نام کرده اید می توانید ابتدا وارد شوید.
    شما میتوانید از این تگهای html استفاده کنید:
    <b> یا <strong>، <em> یا <i>، <u>، <strike> یا <s>، <sup>، <sub>، <blockquote>، <code>، <pre>، <hr>، <br>، <p>، <a href="" title="">، <span style="">، <div align="">
    تجدید کد امنیتی