milo
1.0.0
المتصفح/Nodejs البرمجة التفاعلية ومعالجة DOM التي تعتمد على البيانات مع مكونات معيارية.
الوثائق: http://milojs.github.io/milo/
npm install milojs
أو
bower install milo
npm install
npm install -g grunt-cli
grunt test
لتشغيل جميع الاختبارات ، بما في ذلك اختبارات المتصفح:
grunt tests
index.html
< html >
< head >
< title > Binding example </ title >
< script src =" milo.bundle.js " > </ script >
< script src =" index.js " > </ script >
</ head >
< body >
< input type =" text " ml-bind =" [Data]:myField " >
< div ml-bind =" [Data]:myCurrentValue " > </ div >
< button ml-bind =" [Events]:myTestButton " >
Test
</ button >
< div >
< span ml-bind =" :myTestValue " > </ span >
</ div >
< div >
< h2 > I am connected: </ h2 >
< span ml-bind =" [Data]:myTestValue2 " > </ span >
</ div >
</ body >
</ html >index.js
// run when DOM is ready
milo ( function ( ) {
// create and bind components with milo.binder
var scope = milo . binder ( ) ;
// attach subscriber to data change event via data facet
// of myField component
scope . myField . data . on ( '' , function ( msg , data ) {
scope . myCurrentValue . data . set ( data . newValue ) ;
// alternatively:
// scope.myCurrentValue.el.innerHTML = data.newValue;
} ) ;
// attach subscriber to click event via events facet
// of myTestButton component
scope . myTestButton . events . on ( 'click' , function ( msg , event ) {
scope . myTestValue . el . innerHTML = scope . myField . data . value ( ) ;
} ) ;
// connect two components directly via their data facets
// using milo.minder
milo . minder ( scope . myField . data , '->' , scope . myTestValue2 . data ) ;
} ) ; يستخدم MILO وحدة التحقق ( milo.util.check - متشعب من حزمة التحقق من إطار عمل النيزك) للتحقق من وقت التشغيل لأنواع المعلمات. يوصى بشدة بإيقاف تشغيل هذا الاختبار في الإنتاج باستخدام: milo.config({ check: false }) .
اعتمادًا على تطبيقك ، يمكن أن يحسن الأداء أكثر من مرتين.
مقدمة إلى الربط
مقدمة في وجه البيانات
مقدمة للرسل
مقدمة في النماذج
مقدمة إلى ميندر
مقدمة في القوائم
مقالة حول إنشاء ميلو لترد إطارك الخاص على TUTS+
العينة الأكثر تقدما هي تطبيق Todos في مجلد TODOMVC.
cd $MILO_FOLDER
npm link
cd $MY_PROJECT
rm -R -f -d node_modules/milojs
npm link milojs # link milo to your current project to use with browserify
cd $MILO_FOLDER
grunt # rebuild milo bundle every time you change any .js fileبالإضافة إلى ذلك ، يمكنك إعداد GRUNT في مشروعك لإعادة بنائه كلما تغيرت MILO BUNDLE.
يرجى التأكد من إجراء grunt tests قبل الالتزام (وليس فقط grunt test الذي يتم تشغيله بواسطة Travisci تلقائيًا) - سيقوم بإجراء جميع الاختبارات ، بما في ذلك اختبارات المتصفح.
على الرغم من تعبئة ميلو كحزمة واحدة ، إلا أنها تحتوي على بنية معيارية للغاية. يتكون من عدة وحدات مستقلة يمكن استخدامها معًا أو بشكل منفصل والتي تم تصميمها لتبسيط مهام التطبيق الشائعة بدلاً من إنشاء أي بنية تطبيق معينة.
يمكن استخدام بعض الوحدات في MILO فقط في المتصفح (المكون ، المكون Facet ، Milo.binder) ، وبعضها في المتصفح وفي Nodejs (Messenger وفئاته ذات الصلة ، النموذج ، الموصل ، Milo.minder).
يستخدم MILO نفسه متصفحًا لحزم الحزمة ، ولكن يمكن استخدام أي نظام وحدات في تطبيق يستخدم MILO - MILO لا يشير إلى أي بنية تطبيق.
تم تصميم المكون لتبسيط إدارة DOM. يتم توصيل المكون بعنصر DOM معين. عادةً ما يكون إرفاق عدة مكونات بعنصر DOM نفسه خطأ في التصميم (أو MILO) ، لذلك إذا حدث ذلك ، فسيتم تسجيل خطأ في وحدة التحكم.
تسمح المكونات بإنشاء فئات فرعية سهلة للغاية يتم تعريفها على أنها مجموعة من "الجوانب" التي تم تكوينها. على سبيل المثال ، راجع تعريف مكون MLSelect UI.
هناك قالب مكون لتبسيط إنشاء مكوناتك الخاصة.
انظر وثائق المكون.
ComponentFacet هي فئة أساسية ، فئات فرعية من أساليب المجموعة المتعلقة بسلوكيات المكونات.
نادراً ما تحتاج إلى إنشاء إنشاء جانب - عند إنشاء مكون ، يخلق جميع جوانبه
هناك الجوانب التالية المحددة في ميلو :
يوجد قالب مكون من الوجه لتبسيط خلق جوانك الخاصة. يجب أن تكون جميع جوانب المكونات فئات فرعية لـ ComponentFacet.
عادةً ما يتم إنشاء مثيلات مكوناتك تلقائيًا عند الاتصال بـ milo.binder استنادًا إلى معلومات حول فئات المكونات والجوانب واسم المكون في سمة ml-bind (يمكن تغييرها عبر milo.config).
لإتاحة مكوناتك إلى MILO ، يجب تسجيل فصولهم في سجل المكونات (Milo.registry.components). إذا قمت بتحديد جوانب جديدة ، فيجب تسجيل فصولهم أيضًا (في milo.registry.facets).
نظرًا لأن تسجيل فئات المكونات والوجبات يحدث عادة في نفس الوحدة (ملف) التي تحدد الفئة ، يجب عليك تنفيذ هذه الوحدة. إذا كنت تستخدم Broserify لإدارة الوحدة النمطية ، فهذا يكفي لاستخدامه:
require('my_component');
في أي وحدة أخرى يتم تنفيذها أو مطلوبة.
يوفر MILO فصول المراسلة الداخلية التي يمكن استخدامها أيضًا لاحتياجات التطبيق. تحتوي جميع الجوانب في ميلو على مثيل للرسول المرتبطة بها والتي تحدد واجهة برمجة تطبيقات المراسلة الخاصة بالوجه ، في معظم الحالات التي تتصل بمصدر خارجي (عادة أحداث DOM).
تستخدم مثيلات Messenger مثيلات من الفئات الفرعية MessageSource للاتصال بالمصادر الخارجية وحالات الفئات الفرعية MessengerAPI لإنشاء رسائل داخلية أعلى مستوى وتحويل بيانات الرسائل. تتيح هذه البنية إنشاء وظيفة متقدمة في عدد قليل من أسطر الكود.
انظر وثائق Messenger.
يحدد MILO النموذج للسماح بالوصول الآمن إلى البيانات دون الحاجة إلى القلق مما إذا كانت البيانات قد تم تعيينها (لا ترمي أبدًا عند الوصول إلى البيانات عندما تحصل على خصائص كائنات غير محددة) ولتمكين إمكانية الاشتراك في تغييرات البيانات المشابهة لما يسمح به Object.Observe و Array.Observe.
لا يتطلب استخدام النموذج واجهات برمجة التطبيقات هذه ، وعلى عكس واجهات برمجة التطبيقات هذه ، فإنه يسمح بالاشتراك في التغييرات في خصائص النماذج الخاصة بك إلى أي عمق.
انظر النموذج التجريبي والوثائق النموذجية.
يحدد MILO هذه الفئة لإدارة الاتصال التفاعلي بين الكائنات التي تنفذ واجهة برمجة تطبيقات مراسلة البيانات. كلتا حالات FACET للبيانات والنموذج هي مثل هذه الكائنات.
يمكنك إنشاء اتصالات في اتجاهين أو في اتجاهين ، وتحديد عمق هياكل البيانات التي تريد مراعاتها ، وإيقاف هذه الاتصالات ، على سبيل المثال عندما تريد إجراء العديد من التغييرات النموذجية دون التسبب في تحديثات DOM.
لا تحتوي هذه الاتصالات على إدراج البيانات في الحلقة مثل angularjs ولا تسبب أي تدهور في الأداء عند وجود العديد من الكائنات المتصلة.
ستدعم مثيلات الموصل قريبًا ترجمة الهيكل مما يسمح بإنشاء اتصالات تفاعلية بين النماذج ذات الهياكل الثابتة وأشجار DOM ذات هياكل مرنة.
يمكن إنشاء اتصالات تفاعلية واحدة أو متعددة باستخدام milo.minder.
انظر توثيق الموصل.
domready ويبسط توجيه الرسائل بين Iframes (انظر Frame Facet).تم اختيار Milo Name بسبب Milo Minderbinder ، وهو مستفيد من الحرب من Catch 22. بعد أن بدأ من إدارة عمليات الفوضى ، وسعها إلى مؤسسة تجارية مربحة ، والتي تربط الجميع بكل شيء ، وفي هذا Milo والجميع "لديه حصة".
MILO يحتوي الإطار على موثق الوحدة النمطية ، الذي يربط عناصر DOM بالمكونات (عبر سمة ML-Bind الخاصة) ، و Module Minder التي تسمح بإنشاء اتصالات تفاعلية حية بين مصادر البيانات المختلفة (النموذج ووجهات البيانات من المكونات هذه مصادر بيانات).
من قبيل الصدفة ، يمكن قراءة ميلو كاختصار للبريد عبر الإنترنت .
كانت جميع الأطر التي يمكن أن نضع أيدينا إما بدائية للغاية مما يترك لنا أن تكتب الكثير من الكود الخاص بنا (jQuery ، العمود الفقري) أو الحد من السحر الكافي لبناء تطبيق بسيط سريعًا ولكن مع التحكم المحدود في الأداء الدقيق للإطار (الزاوي ، EXT).
ما كنا نريده دائمًا هو إطار من شأنه أن يسمح
لم نتمكن من العثور على مثل هذا الإطار ، لذلك بدأنا في تطوير ميلو بالتوازي مع التطبيق الذي يستخدمه.
### النموذج الأولي على أساس الميراث
يعتمد ميلو على نماذج جافا سكريبت لبناء كتل إطار.
JavaScript هي لغة ديناميكية للغاية. يتيح وظائف الكتابة التي تنشئ فئات ( Component.createComponentClass .
يسمح JavaScript أيضًا بإنشاء وظائف مُنشأة تنشئ وظائف تجعل بناء بناء جملة معبرة للغاية لكائنات النموذج وكذلك "تجميع" وقت التشغيل لمسارات الوصول إلى النموذج في وظائف.
تعتمد فئة المكون على فئة مجردة FacetedObject التي يمكن تطبيقها على أي مجال يمكن تمثيل الكائنات من خلال جمع الجوانب (الجوانب هو كائن لفئة معينة ، فهي تحمل تكوينها وبياناتها وطرقها).
بطريقة ما ، نمط الجوانب هو انعكاس لنمط المحول - في حين أن الأخير يسمح بإيجاد فئة/طرق لها وظائف محددة ، يتم بناء كائن موجود ببساطة للحصول على هذه الوظائف. وبهذه الطريقة ، من الممكن إنشاء عدد غير محدود تقريبًا من فئات المكونات مع عدد محدود للغاية من لبنات البناء دون أن يكون هناك تسلسل هرمي طويل للصفوف - ترث معظم المكونات مباشرة من فئة المكونات.
في الوقت نفسه ، يدعم MILO آلية الميراث عندما يمكن للفئة الفرعية إضافة جوانب إلى تلك الموجودة بالفعل في فئة فائقة ولإعادة تحديد تكوين الجوانب الموروثة.
نستخدم أيضًا نمط Mixin ، ولكن يتم تنفيذ Mixin في MILO ككائن منفصل يتم تخزينه على خاصية كائن المضيف ويمكنه إنشاء طرق وكيل على كائن المضيف إذا لزم الأمر. الفصول الدراسية Messenger و MessageSource و DataSource هي فئة فرعية من فئة Mixin Abstract.
تسجل المكونات والوجهات نفسها في السجلات التي تسمح بتجنب طلبها من وحدة واحدة. يمنع التبعيات الدائرية بين الوحدات.
تبعيات MILO هي Proto ، وهي مكتبة معالجة الكائنات ونقطة ، محرك templating (كلاهما مدرج في حزمة MILO).
نحن لا نستخدم أي مكتبة DOM Traversal لأن:
بدلاً من ذلك ، يمكن أن تحتوي مكونات MILO على DOM Facet تتضمن العديد من وظائف الراحة لمعالجة عناصر DOM وهناك milo.util.dom - مجموعة مماثلة من الوظائف التي يمكن استخدامها بدون مكونات.
يستخدم MILO بروتو المكتبة الذي يحتوي على مجموعة من وظائف الأداة المساعدة للتلاعب بالكائنات والنماذج الأولية والصفائف والوظائف والسلاسل. يرجى الاطلاع على مستودعها للوثائق والأسباب وراء قرار عدم استخدام مكتبات الطرف الثالث.
يتم تجميعها مع ميلو وجميع وظائفها متوفرة كخصائص للكائن _ ، لا تحتاج إلى تحميلها بشكل منفصل.
http://opensource.org/licenses/BSD-2
انظر الإصدارات
