جاوااسکریپت - تفاوت بین MEAN.js و MEAN.io
من میخواستم از پشته جاوااسکریپت MEAN استفاده کنم، اما متوجه شدم که دو پشته متفاوت وجود دارد که هر کدام وبسایت و روشهای نصب خود را دارند: mean.js و mean.io. بنابراین این سؤال برایم پیش آمد: «کدام یک را استفاده کنم؟».
پس برای پاسخ به این سؤال، از جامعه میپرسم که آیا میتوانید توضیح دهید تفاوتهای بین این دو چیست؟ و اگر ممکن است مزایا و معایب آنها چیست؟ چون برای من بسیار شبیه به هم به نظر میرسند.
پاسخ شماره ۱
آنها اساساً یکی هستند... هر دو از swig برای قالببندی استفاده میکنند، هر دو از karma و mocha برای تستها استفاده میکنند، ادغام با passport، nodemon و غیره.
چرا اینقدر مشابه؟ Mean.js یک شاخه از Mean.io است و هر دو پروژه توسط یک نفر آغاز شدند... Mean.io اکنون زیر مجموعهی شرکت Linnovate است و به نظر میرسد آن شخص (آموس هویو) همکاری خود با این شرکت را متوقف کرده و Mean.js را راهاندازی کرده است. میتوانید دلایل بیشتر را اینجا بخوانید.
حالاً... تفاوتهای اصلی (یا کوچک) که میتوانید همین حالا ببینید عبارتند از:
داربست و تولید قالب پایه
Mean.io از یک ابزار خط فرمان سفارشی با نام 'mean' استفاده میکند
Mean.js از Yeoman Generators استفاده میکند
ماژولاریتی
Mean.io از ماژولهای نود که خودکفا تر هستند استفاده میکند و فایلهای کلاینت و سرور را داخل ماژولها قرار میدهد.
Mean.js ماژولها را فقط در فرانتاند (برای انگولار) استفاده میکند و آنها را با اکسپرس متصل میکند. اگرچه آنها روی ماژولهای عمودی هم کار میکردند...
سیستم ساخت
Mean.io اخیراً به گالپ منتقل شده است
Mean.js از گرانت استفاده میکند
استقرار
هر دو در مخازن خود فایلهای داکر دارند و Mean.io دارای نصب با یک کلیک در Google Compute Engine است، در حالی که Mean.js نیز میتواند با نصب با یک کلیک در Digital Ocean مستقر شود.
مستندات
Mean.io مستندات قابل قبولی دارد
Mean.js مستندات عالی دارد
اجتماع
Mean.io یک جامعه بزرگتر دارد چون پایه اصلی اولیه بود
Mean.js شتاب کمتری دارد اما رشد پایداری دارد
در سطح شخصی، من فلسفه و باز بودن MeanJS را بیشتر دوست دارم و همچنین گرایش و رویکرد ماژولها/بستههای MeanIO را بیشتر میپسندم. هر دو خوب هستند و در نهایت احتمالاً آنها را تغییر میدهید، بنابراین واقعاً نمیتوانید در انتخاب یکی از دیگری اشتباه کنید. فقط آنها را به عنوان نقطه شروع و تمرین یادگیری در نظر بگیرید.
راهحلهای «میانگین» جایگزین
MEAN یک روش عمومی (ایجاد شده توسط والری کارپوف) برای توصیف یک چارچوب/الگوی پایه است که «Mongo + Express + Angular + Node» را به عنوان پایهی پشته استفاده میکند. شما میتوانید چارچوبهایی با این پشته پیدا کنید که از نامهای دیگر استفاده میکنند، برخی از آنها واقعاً برای توسعه سریع برنامهها (RAD) و ساخت برنامههای تکصفحهای (SPA) مناسب هستند. به عنوان مثال:
- متیور. اکنون با پشتیبانی رسمی انگولار، نمایانگر یک استک MEAN عالی است
- استرانگلوپ لوپبک (مهمترین مشارکتکنندگان هستهی Node.js و نگهدارندگان Express)
- ژنراتور انگولار فولاستک
- سیلز.جیاس
- کلوراستک
- Deployd و غیره (موارد بیشتری وجود دارد)
شما همچنین Hackathon Starter را دارید. آن حرف A از MEAN را ندارد (این 'MEN' است)، اما عالی است..
خوش بگذره!
پاسخ شماره ۲
ابتدا، MEAN مخفف MongoDB، Express، Angular و Node.js است.
این به طور کلی استفاده ترکیبی از این فناوریها را در یک «كد» شناسایی میکند. چیزی به نام «چارچوب MEAN» وجود ندارد.
لیور کسوس در شرکت Linnovate از این سردرگمی بهره برد. او دامنه MEAN.io را خرید و مقداری کد در https://github.com/linnovate/mean قرار داد
آنها خوشبختانه تبلیغات زیادی دریافت کردند، و مقالات و ویدئوهای بیشتری درباره MEAN وجود دارد. وقتی در گوگل "فریمورک MEAN" را جستجو میکنید، mean.io اولین مورد در فهرست است.
متأسفانه کد در https://github.com/linnovate/mean به نظر میرسد بهطور ضعیف طراحی شده باشد.
در فوریه خودم در آن تله افتادم. سایت mean.io طراحی جذابی داشت و مخزن گیتهاب آن بیش از 1000 ستاره داشت. ایده پرسش از کیفیت حتی به ذهنم هم خطور نکرد. شروع به آزمایش آن کردم اما مدت طولانی طول نکشید تا با چیزهایی مواجه شوم که کار نمیکردند و قطعات گیجکنندهای از کد.
تاریخچه کامیت نیز نسبتاً نگرانکننده بود. آنها کد و ساختار دایرکتوری را چندین بار بازمهندسی کردند و ادغام تغییرات جدید خیلی زمانبر است.
نکات مثبت در مورد هر دو mean.io و mean.js این است که با یکپارچهسازی Bootstrap ارائه میشوند. آنها همچنین با احراز هویت Facebook، Github، Linkedin و غیره از طریق PassportJs و یک نمونه مدل (Article) در بکاند روی MongoDB که با مدل فرانتاند با AngularJS همگام است، ارائه میشوند.
طبق وبسایت لینوویت:
لینوییت شرکت پیشرو در زمینه متنباز در اسرائیل است، با تیمی باتجربهترین کشور که متعهد به ایجاد راهحلهای متنباز پیشرفته است. لینوییت تنها شرکتی در اسرائیل است که خدمات A تا Z را برای شرکتها در زمینه ساخت و نگهداری پروژه وب بعدی خود ارائه میدهد.
از روی وبسایت به نظر میرسد که مهارت اصلی آنها در دروپال (یک سیستم مدیریت محتوای PHP) است و تنها اخیراً شروع به استفاده از Node.js و AngularJS کردهاند.
اخیراً من در حال خواندن وبلاگ Mean.js بودم و مسائل برایم روشنتر شد. فهم من این است که توسعهدهنده اصلی جاوااسکریپت (آموس هاویو) شرکت Linnovate را ترک کرد تا روی Mean.js کار کند و پروژه MEAN.io را با افرادی که تازهکار در Node.js هستند و به آرامی در حال درک چگونگی کارکرد چیزها هستند، تنها گذاشت.
در آینده ممکن است اوضاع تغییر کند اما فعلاً از استفاده از mean.io اجتناب میکنم. اگر به دنبال یک قالب آماده برای شروع سریع هستید، به نظر میرسد Mean.js گزینه بهتری نسبت به mean.io باشد.
پاسخ شماره ۳
در اینجا یک مقایسه کنار هم از چندین استارتر/ژنراتور برنامه و فناوریهای دیگر از جمله MEAN.js، MEAN.io و cleverstack ارائه شده است. من همچنان جایگزینهایی را اضافه میکنم هر زمان که فرصت پیدا میکنم و با این کار، فهرست مزایای احتمالی ارائه شده نیز در حال افزایش است. امروزه این عدد به حدود ۱۶۰۰ رسیده است. اگر کسی میخواهد به بهبود دقت یا کامل بودن آن کمک کند، روی لینک بعدی کلیک کرده و یک پرسشنامه درباره موضوعی که میداند، تکمیل کند.
مقایسه پروژه فناوریهای اپلیکیشن
از این پایگاه داده، سیستم گزارشهایی مانند موارد زیر تولید میکند:
گزارش مقایسهای MeanJS و MeanIO
پاسخ شماره ۴
صفحه مبادلات اولیه در صفحه گسترده مقایسه من، مقایسههای جامع یکبهیک بین هر ژنراتور را دارد. بنابراین دیگر نیازی به برداشتهای تحریفشده و انتخاب گزینشی ویژگیهای خوب برای ژنراتور مورد علاقهتان نیست.
در اینجا مقایسه بین generator-angular-fullstack و MEAN.js است. درصدها مقادیر هر مزیت بر اساس وزندهی شخصی من هستند، جایی که یک ژنراتور کامل ۱۰۰٪ خواهد بود
ژنراتور- انگولار- فولاستک، ۸٪ امکانات را ارائه میدهد که MEANJS.org ارائه نمیدهد
- ۱.۹٪ تستهای انتها به انتهای سمت کاربر
- ۰٫۶٪ کارخانه
- 0.5٪ ارائهدهنده
- ۰٫۴٪ ساس
- ۰٫۴٪ کمتر
- 0.4٪ قطبنما
- تزئینکننده ۰.۴٪
- زیرمولد نقطه پایانی 0.4٪
- ۰٫۴٪ نظر
- ۰٫۳٪ فونتآوسام
- ۰.۳٪ اجرای سرور در حالت اشکالزدایی
- 0.3٪ پاسخهای ژنراتور را در یک فایل ذخیره کنید
- ۰٫۲٪ ثابت
- اسکریپت ساخت توسعه ۰.۲٪: ...... جایگزینی وابستگیهای شخص ثالث با نسخههای CDN
- ۰.۲٪ احراز هویت - کوکی
- احراز هویت ۰.۲٪ - توکن وب JSON (JWT)
- ۰.۲٪ گزارشگیری سمت سرور
- اسکریپت ساخت توسعه ۰.۱٪: اجرای وظایف بهصورت موازی برای سرعت بخشیدن به آن
- اسکریپت ساخت نسخه توسعه 0.1٪: تغییر نام فایلهای دارایی برای جلوگیری از کش شدن توسط مرورگر
- اسکریپت ساخت توسعه 0.1٪: اجرای تستهای انتها به انتها
- اسکریپت ساخت تولید 0.1٪: پیشفشردهسازی ایمن
- 0.1٪ اسکریپت ساخت تولید: افزودن پیششمارندههای CSS
- خودکارسازی استقرار ۰.۱٪ هروکو
- ۰٫۱٪ ارزش
- ۰٫۱٪ یشم
- ۰.۱٪ کافهاسکریپت
- محدودیت مسیر احراز هویت شده سرور با 0.1%
- نسخه 0.1٪ SASS از توییتر بوتاسترپ
- 0.1٪ اسکریپت ساخت تولید: فشردهسازی تصاویر
- خودکارسازی استقرار OpenShift 0.1٪
وبسایت MeanJS.org، ۹٪ امکاناتی ارائه میدهد که generator-angular-fullstack ارائه نمیدهد
- ۳.۷٪ گروه کاربران اختصاصی/قابل جستجو: زمان پاسخگویی معمولاً کمتر از یک روز
- ۰٫۴٪ تولید مسیرها
- احراز هویت 0.4% - اوتور
- 0.4٪ پیکربندی
- ۰.۴٪ بینالمللیسازی، بومیسازی
- پروفایل برنامه ورودی 0.4%
- ۰.۳٪ ویژگی (یا همان ماژول، موجودیت، شبیهسازی CRUD)
- سیستم منو ۰.۳٪
- ۰.۳٪ گزینهها برای ساخت زیرقطعات
- تست 0.3٪ - سمت مشتری
- 0.3٪ مسئله عملکرد جاوااسکریپت
- 0.3٪ اسکریپت ساخت نسخه تولید: ایجاد صفحات استاتیک برای سئو
- نصب سریع 0.2٪؟
- ۰.۲٪ گروه کاربری اختصاصی/قابل جستجو
- اسکریپت ساخت توسعه 0.1٪: بارگذاری مجدد فایل ساخت هنگام تغییر
- اسکریپت ساخت توسعه 0.1٪: فایلهای coffee به JS کامپایل شدند
- ۰.۱٪ کنترلکننده - سمت سرور
- مدل 0.1٪ - سمت سرور
- ۰.۱٪ مسیر - سمت سرور
- تست 0.1٪ - سمت سرور
- ۰٫۱٪ سوئیگ
- ۰.۱٪ امن در برابر جعل IP
- 0.1٪ اسکریپت ساخت تولید: زشتسازی
- رویکرد 0.0٪ به نماها: آدرسهای اینترنتی با "#!" شروع میشوند
- ۰.۰٪ رویکرد به خدمات فرانتاند و فراخوانیهای آژاکس: از $resource استفاده میکند
اینجا مقایسهای بین MEAN.io و MEAN.js در قالبی خواناتر است
<table border="1" cellpadding="10"><tbody><tr><td valign="top" width="33%"><br><br><h1>MeanJS.org. provides these benefits that MEAN.io. doesn't</h1><br><br><b>Help</b>:<br> * Dedicated/searchable user group for questions, using github issues<br> * There's a book about it<br><b>File Organization</b>:<br> * Basic sourcecode organization, module(->submodule)->side<br> * Module directories hold directives<br><b>Code Modularization</b>:<br> * Approach to AngularJS modules, Only one module definition per file<br> * Approach to AngularJS modules, Don’t alter a module other than where it is defined<br><b>Model</b>:<br> * Object-relational mapping<br> * Server-side validation, server-side example<br> * Client side validation, using Angular 1.3<br><b>View</b>:<br> * Approach to AngularJS views, Directives start with "data-"<br> * Approach to data readiness, Use ng-init<br><b>Control</b>:<br> * Approach to frontend routing or state changing, URLs start with '#!'<br> * Approach to frontend routing or state changing, Use query parameters to store route state<br><b>Support for things</b>:<br> * Languages, LESS<br> * Languages, SASS<br><b>Syntax, language and coding</b>:<br> * JavaScript 5 best practices, Don't use "new"<br><b>Testing</b>:<br> * Testing, using Mocha<br> * End-to-end tests<br> * End-to-end tests, using Protractor<br> * Continuous integration (CI), using Travis<br><b>Development and debugging</b>:<br> * Command line interface (CLI), using Yeoman<br><b>Build</b>:<br> * Build configurations file(s)<br> * Deployment automation, using Azure<br> * Deployment automation, using Digital Ocean, screencast of it<br> * Deployment automation, using Heroku, screencast of it<br><b>Code Generation</b>:<br> * Input application profile<br> * Quick install?<br> * Options for making subcomponents<br> * config generator<br> * controller (client side) generator<br> * directive generator<br> * filter generator<br> * route (client side) generator<br> * service (client side) generator<br> * test - client side<br> * view or view partial generator<br> * controller (server side) generator<br> * model (server side) generator<br> * route (server side) generator<br> * test (server side) generator<br><b>Implemented Functionality</b>:<br> * Account Management, Forgotten Password with Resetting<br> * Chat<br> * CSV processing<br> * E-mail sending system<br> * E-mail sending system, using Nodemailer<br> * E-mail sending system, using its own e-mail implementation<br> * Menus system, state-based<br> * Paypal integration<br> * Responsive design<br> * Social connections management page<br><b>Performance</b>:<br> * Creates a favicon<br><b>Security</b>:<br> * Safe from IP Spoofing<br> * Authorization, Access Contol List (ACL)<br> * Authentication, Cookie<br> * Websocket and RESTful http share security policies<br><br><br></td><td valign="top" width="33%"><br><br><h1>MEAN.io. provides these benefits that MeanJS.org. doesn't</h1><br><br><b>Quality</b>:<br> * Sponsoring company<br><b>Help</b>:<br> * Docs with flatdoc<br><b>Code Modularization</b>:<br> * Share code between projects<br> * Module manager<br><b>View</b>:<br> * Approach to data readiness, Use state.resolve()<br><b>Control</b>:<br> * Approach to frontend code loading, Use AMD with Require.js<br> * Approach to frontend code loading, using wiredep<br> * Approach to error handling, Server-side logging<br><b>Client/Server Communication</b>:<br> * Centralized event handling<br> * Approach to XHR calls, using $http and $q<br><b>Syntax, language and coding</b>:<br> * JavaScript 5 best practices, Wrap code in an IIFE (SEAF, SIAF)<br><b>Development and debugging</b>:<br> * API introspection report and testing interface, using Swagger<br> * Command line interface (CLI), using Independent command line interface<br><b>Build</b>:<br> * Development build, add IIFEs (SEAF, SIAF) to executable copies of code<br> * Deployment automation<br> * Deployment automation, using Heroku<br><b>Code Generation</b>:<br> * Scaffolding undo (mean package -d <name>)<br> * FEATURE (a.k.a. module, entity) generator, Menu items added for new features<br><b>Implemented Functionality</b>:<br> * Admin page for users and roles<br> * Content Management System (Use special data-bound directives in your templates.<br>Switch to edit mode and you can edit the values right where you see them)<br> * File Upload<br> * i18n, localization<br> * Menus system, submenus<br> * Search<br> * Search, actually works with backend API<br> * Search, using Elastic Search<br> * Styles, using Bootstrap, using UI Bootstrap AngularJS directives<br> * Text (WYSIWYG) Editor<br> * Text (WYSIWYG) Editor, using medium-editor<br><b>Performance</b>:<br> * Instrumentation, server-side<br><b>Security</b>:<br> * Serverside authenticated route restriction<br> * Authentication, using Oauth, Link multiple Oauth strategies to one account<br> * Authentication, JSON Web Token (JWT)<br><br><br></td><td valign="top" width="33%"><br><br><h1>MEAN.io. and MeanJS.org. both provide these benefits</h1><br><br><b>Quality</b>:<br> * Version Control, using git<br><b>Platforms</b>:<br> * Client-side JS Framework, using AngularJS<br> * Frontend Server/ Framework, using Node.JS<br> * Frontend Server/ Framework, using Node.JS, using Express<br> * API Server/ Framework, using NodeJS<br> * API Server/ Framework, using NodeJS, using Express<br><b>Help</b>:<br> * Dedicated/searchable user group for questions<br> * Dedicated/searchable user group for questions, using Google Groups<br> * Dedicated/searchable user group for questions, using Facebook<br> * Dedicated/searchable user group for questions, response time mostly under a day<br> * Example application<br> * Tutorial screencast in English<br> * Tutorial screencast in English, using Youtube<br> * Dedicated chatroom<br><b>File Organization</b>:<br> * Basic sourcecode organization, module(->submodule)->side, with type subfolders<br> * Module directories hold controllers<br> * Module directories hold services<br> * Module directories hold templates<br> * Module directories hold unit tests<br> * Separate route configuration files for each module<br><b>Code Modularization</b>:<br> * Modularized Functionality<br> * Approach to AngularJS modules, No global 'app' module variable<br> * Approach to AngularJS modules, No global 'app' module variable without an IIFE<br><b>Model</b>:<br> * Setup of persistent storage<br> * Setup of persistent storage, using NoSQL db<br> * Setup of persistent storage, using NoSQL db, using MongoDB<br><b>View</b>:<br> * No XHR calls in controllers<br> * Templates, using Angular directives<br> * Approach to data readiness, prevents Flash of Unstyled/compiled Content (FOUC)<br><b>Control</b>:<br> * Approach to frontend routing or state changing, example of it<br> * Approach to frontend routing or state changing, State-based routing<br> * Approach to frontend routing or state changing, State-based routing, using ui-router<br> * Approach to frontend routing or state changing, HTML5 Mode<br> * Approach to frontend code loading, using angular.bootstrap()<br><b>Client/Server Communication</b>:<br> * Serve status codes only as responses<br> * Accept nested, JSON parameters<br> * Add timer header to requests<br> * Support for signed and encrypted cookies<br> * Serve URLs based on the route definitions<br> * Can serve headers only<br> * Approach to XHR calls, using JSON<br> * Approach to XHR calls, using $resource (angular-resource)<br><b>Support for things</b>:<br> * Languages, JavaScript (server side)<br> * Languages, Swig<br><b>Syntax, language and coding</b>:<br> * JavaScript 5 best practices, Use 'use strict'<br><b>Tool Configuration/customization</b>:<br> * Separate runtime configuration profiles<br><b>Testing</b>:<br> * Testing, using Jasmine<br> * Testing, using Karma<br> * Client-side unit tests<br> * Continuous integration (CI)<br> * Automated device testing, using Live Reload<br> * Server-side integration & unit tests<br> * Server-side integration & unit tests, using Mocha<br><b>Development and debugging</b>:<br> * Command line interface (CLI)<br><b>Build</b>:<br> * Build-time Dependency Management, using npm<br> * Build-time Dependency Management, using bower<br> * Build tool / Task runner, using Grunt<br> * Build tool / Task runner, using gulp<br> * Development build, script<br> * Development build, reload build script file upon change<br> * Development build, copy assets to build or dist or target folder<br> * Development build, html page processing<br> * Development build, html page processing, inject references by searching directories<br> * Development build, html page processing, inject references by searching directories, injects js references<br> * Development build, html page processing, inject references by searching directories, injects css references<br> * Development build, LESS/SASS/etc files are linted, compiled<br> * Development build, JavaScript style checking<br> * Development build, JavaScript style checking, using jshint or jslint<br> * Development build, run unit tests<br> * Production build, script<br> * Production build, concatenation (aggregation, globbing, bundling) (If you add debug:true to your config/env/development.js the will not be <br>uglified)<br> * Production build, minification<br> * Production build, safe pre-minification, using ng-annotate<br> * Production build, uglification<br> * Production build, make static pages for SEO<br><b>Code Generation</b>:<br> * FEATURE (a.k.a. module, entity) generator (README.md<br>feature css<br>routes<br>controller<br>view<br>additional menu item)<br><b>Implemented Functionality</b>:<br> * 404 Page<br> * 500 Page<br> * Account Management<br> * Account Management, register/login/logout<br> * Account Management, is password manager friendly<br> * Front-end CRUD<br> * Full-stack CRUD<br> * Full-stack CRUD, with Read<br> * Full-stack CRUD, with Create, Update and Delete<br> * Google Analytics<br> * Menus system<br> * Realtime data sync<br> * Realtime data sync, using socket.io<br> * Styles, using Bootstrap<br><b>Performance</b>:<br> * Javascript performance thing<br> * Javascript performance thing, using lodash<br> * One event-loop thread handles all requests<br> * Configurable response caching (Express plugin<br><b>https</b>://www.npmjs.org/package/apicache)<br> * Clustered HTTP sessions<br><b>Security</b>:<br> * JavaScript obfuscation<br> * https<br> * Authentication, using Oauth<br> * Authentication, Basic (With Passport or others)<br> * Authentication, Digest (With Passport or others)<br> * Authentication, Token (With Passport or others)<br></td></tr></tbody></table>