Mike Bartlett and Andrew Newdigate, founders of Gitter, discuss lessons learned building and scaling a realtime web application with the Marionette NY Community.
Marionette.js is a JavaScript framework that builds upon Backbone.js to provide additional structure and functionality. It fills gaps in Backbone by implementing common patterns for views like ItemView, CollectionView, CompositeView, and LayoutView. These views provide functionality for rendering individual models, collections of models, composite views that combine a collection within a template, and complex nested layouts with multiple regions respectively. The framework is actively maintained by a core team and large community and used by many large applications for its flexibility, separation of concerns, and ability to build complex UIs through nesting of views and regions.
The document summarizes the author's experience using Backbone and Marionette frameworks on several projects at SoftServe. It describes the technology stacks used, including versions of Backbone, Marionette, and other libraries. It then reviews three projects (SCM, DMG, EWQ) and discusses how Backbone and Marionette were implemented in each, including use of models, views, controllers, and modules. The outcomes section notes best practices and strengths of MV* patterns and modularization with Marionette.
Building Backbone applications quickly became a de-facto standard, though we can’t really define it as framework but rather just as foundation to create other frameworks.
If you like Backbone, you’ll fall in love with Marionette, the best application library to create large scale Javascript applications.
Nicholas will explain the framework, show examples and talk about some projects like cronycle.com that have been delivered to production using Marionette.
Backbone And Marionette : Take Over The Worldharshit040591
The document discusses how Adobe optimized their application by transitioning to a Marionette framework. Some key points:
- Page load time improved from 3 seconds to 0.5 seconds. Bugs and network time also significantly reduced.
- Marionette is an MVC framework that separates data from views using models, collections, and modular components.
- It handles complex view management and messaging better than Backbone alone. Views can be easily reused by attaching them to regions.
- Future versions will integrate Backbone.Radio for messaging with request/response capabilities. A CacheableRadio add-on further optimizes this by caching and invalidating responses.
For a presentation given to the Angular DC Meetup on 3/19/14. (http://www.meetup.com/AngularJS-DC/events/169813802/) Part 2 of the "Angular from Scratch" series. Find part one at http://christianlilley.wordpress.com/2013/11/15/angular-from-scratch-slides-from-angularjs-meetup-dc/ . Find the accompanying demonstration files at https://github.com/xmlilley/ng-demos.
The document introduces Marionette, a JavaScript framework that helps build single page applications. It covers core Marionette concepts like routing, layouts, and event handling. It then provides an example of building a simple microblogging app to demonstrate rendering data and handling user input without advanced styling. The document lists Marionette components like the Application, AppRouter, Controller and Views that help link the page, routes, and data flow. It also mentions related Backbone concepts like Models, Collections, and event triggering that Marionette builds upon. Helpful links are provided and the author offers to answer any questions.
Flex Building User Interface ComponentsAhmad Hamid
design user interface components in flex is just like any other language. This presentation provides some guidelines as to how such components should be design and implemented with performance in mind.
This document discusses strategies for streamlining application architecture. It defines a large application as one requiring significant effort to maintain. Examples given include Gmail, Yahoo homepage, and MobileMe. Current architectures are described as having custom widgets, modules, MVC patterns and libraries coupled together. Problems identified include lack of reusability and tight coupling. The document proposes using a module pattern with loose coupling, a facade abstraction layer, and mediator pattern to improve maintainability. Modules would communicate through publishing events to the facade/mediator core rather than directly accessing each other.
Marionette.js is a JavaScript framework that builds upon Backbone.js to provide additional structure and functionality. It fills gaps in Backbone by implementing common patterns for views like ItemView, CollectionView, CompositeView, and LayoutView. These views provide functionality for rendering individual models, collections of models, composite views that combine a collection within a template, and complex nested layouts with multiple regions respectively. The framework is actively maintained by a core team and large community and used by many large applications for its flexibility, separation of concerns, and ability to build complex UIs through nesting of views and regions.
The document summarizes the author's experience using Backbone and Marionette frameworks on several projects at SoftServe. It describes the technology stacks used, including versions of Backbone, Marionette, and other libraries. It then reviews three projects (SCM, DMG, EWQ) and discusses how Backbone and Marionette were implemented in each, including use of models, views, controllers, and modules. The outcomes section notes best practices and strengths of MV* patterns and modularization with Marionette.
Building Backbone applications quickly became a de-facto standard, though we can’t really define it as framework but rather just as foundation to create other frameworks.
If you like Backbone, you’ll fall in love with Marionette, the best application library to create large scale Javascript applications.
Nicholas will explain the framework, show examples and talk about some projects like cronycle.com that have been delivered to production using Marionette.
Backbone And Marionette : Take Over The Worldharshit040591
The document discusses how Adobe optimized their application by transitioning to a Marionette framework. Some key points:
- Page load time improved from 3 seconds to 0.5 seconds. Bugs and network time also significantly reduced.
- Marionette is an MVC framework that separates data from views using models, collections, and modular components.
- It handles complex view management and messaging better than Backbone alone. Views can be easily reused by attaching them to regions.
- Future versions will integrate Backbone.Radio for messaging with request/response capabilities. A CacheableRadio add-on further optimizes this by caching and invalidating responses.
For a presentation given to the Angular DC Meetup on 3/19/14. (http://www.meetup.com/AngularJS-DC/events/169813802/) Part 2 of the "Angular from Scratch" series. Find part one at http://christianlilley.wordpress.com/2013/11/15/angular-from-scratch-slides-from-angularjs-meetup-dc/ . Find the accompanying demonstration files at https://github.com/xmlilley/ng-demos.
The document introduces Marionette, a JavaScript framework that helps build single page applications. It covers core Marionette concepts like routing, layouts, and event handling. It then provides an example of building a simple microblogging app to demonstrate rendering data and handling user input without advanced styling. The document lists Marionette components like the Application, AppRouter, Controller and Views that help link the page, routes, and data flow. It also mentions related Backbone concepts like Models, Collections, and event triggering that Marionette builds upon. Helpful links are provided and the author offers to answer any questions.
Flex Building User Interface ComponentsAhmad Hamid
design user interface components in flex is just like any other language. This presentation provides some guidelines as to how such components should be design and implemented with performance in mind.
This document discusses strategies for streamlining application architecture. It defines a large application as one requiring significant effort to maintain. Examples given include Gmail, Yahoo homepage, and MobileMe. Current architectures are described as having custom widgets, modules, MVC patterns and libraries coupled together. Problems identified include lack of reusability and tight coupling. The document proposes using a module pattern with loose coupling, a facade abstraction layer, and mediator pattern to improve maintainability. Modules would communicate through publishing events to the facade/mediator core rather than directly accessing each other.
Building Large Scale Javascript ApplicationAnis Ahmad
In recent years a number of libraries for building large JavaScript applications has appeared. As we no longer need to battle DOM differences between browsers we can finally focus on building highly interactive front-end applications instead. But before we can do a good job with these new libraries we need unlearn our previous DOM-centric approach and need to be aware of good practices and patterns of developing modern javascript app.
It will start with jQuery based old style practices and try to discuss on how can we approach to a modular, decoupled, scalable application architecture. This slide was prepared in very short time for technical session series of Digital World 2014 (http://www.digitalworld.org.bd/technical-session). The event video is here - https://www.youtube.com/watch?v=Gpw7l27MUUc (slide was not properly covered in video).
It has taken inspiration, ideas (, even some contents) from the following sources -
* http://addyosmani.com/largescalejavascript/
* http://addyosmani.com/resources/essentialjsdesignpatterns/book/
* https://www.youtube.com/watch?v=vXjVFPosQHw
* https://www.youtube.com/watch?v=qWr7x9wk6_c
* https://speakerdeck.com/kimjoar/patterns-of-large-scale-javascript-applications-1
jQquerysummit - Large-scale JavaScript Application Architecture Jiby John
The document discusses organizing jQuery and JavaScript applications using different patterns and frameworks. It begins by explaining design patterns and their benefits. It then covers using the Model-View-Controller (MVC) pattern with jQuery, providing examples of MVC frameworks. Finally, it discusses other JavaScript patterns for organizing code into reusable modules.
This document provides an overview of AngularJS, including its philosophy and architecture. AngularJS aims to simplify development by providing model-view-controller frameworks and dependency injection. It advocates for declarative code for building user interfaces rather than imperative code. The document also discusses AngularJS concepts like templates, scopes, models, repeaters, filters and custom directives to build single page applications.
Top 45 jQuery Interview Questions and Answers | EdurekaEdureka!
YouTube Link: https://youtu.be/nmX4ycVIXt8
** Full Stack Web Developer Masters Program: https://www.edureka.co/masters-program/full-stack-developer-training **
This Edureka PPT on "jQuery Interview Questions" will help you to prepare yourself for jQuery or web development interviews. Learn about the most important jQuery interview questions and answers and know what will set you apart in the interview process.
Follow us to never miss an update in the future.
YouTube: https://www.youtube.com/user/edurekaIN
Instagram: https://www.instagram.com/edureka_learning/
Facebook: https://www.facebook.com/edurekaIN/
Twitter: https://twitter.com/edurekain
LinkedIn: https://www.linkedin.com/company/edureka
Castbox: https://castbox.fm/networks/505?country=in
Five class-based views everyone has written by nowJames Aylett
This document discusses the use of class-based views in Django and some challenges that arise when implementing more complex view logic compared to function-based views. It introduces five class-based views for common CRUD operations and describes additional mixins and custom views created to address issues like creating objects that are related to or bound by other objects, updating multiple related objects at once, and paginating child objects on a detail view. Additional topics like permissions are also briefly mentioned.
AngularJS is a JavaScript MVC framework developed by Google in 2009. It uses HTML enhanced with directives to bind data to the view via two-way data binding. AngularJS controllers define application behavior by mapping user actions to the model. Core features include directives, filters, expressions, dependency injection and scopes that connect controllers and views. Services like $http are used to retrieve server data. AngularJS makes building single page applications easier by taking care of DOM updates automatically.
This document provides instructions on how to create a basic "Hello Widget" Android widget app. It discusses creating a new Android project, designing the widget layout with XML, adding code to the AppWidgetProvider to handle updates, and testing the widget. It also provides an example of adding interactivity by coding buttons on the widget and handling button clicks by launching an activity. The document history section lists the document versions and authors.
- React is a JavaScript library for building user interfaces created by Facebook that uses a component-based approach to building UIs with a focus on immutable data structures and one-way data flow.
- Major companies like Facebook, Instagram, AirBnB, and Khan Academy use React to build their user interfaces.
- React uses a virtual DOM for rendering components to optimize performance and allow for extremely fast render times compared to traditional approaches that directly manipulate the real DOM.
Creating the interfaces of the future with the APIs of todaygerbille
The document discusses creating futuristic interfaces using web technologies like WebSockets, WebGL, and device APIs. It provides examples of syncing device orientation over WebSockets between clients, accessing the device camera with getUserMedia, and using head tracking with headtrackr.js to control the camera in a 3D scene rendered with three.js. Links are included for related projects on Wiimote control, head tracking examples, and touch tracking demos.
Building Rich User Experiences Without JavaScript SpaghettiJared Faris
Jared Faris discusses how to build rich user experiences without messy JavaScript code. He advocates for decoupling JavaScript objects, writing small discrete chunks of code, and pushing events rather than state between objects. This avoids JavaScript spaghetti and promotes loose coupling between components. Design patterns like Mediator and Observer are useful, as are tools like Knockout and Backbone that help manage state, routing, and views. Testing discrete layers without HTML elements also helps produce clean, modular code.
Architecting Single Activity Applications (With or Without Fragments)Gabor Varadi
Presentation by Gabor Varadi (@zhuinden)
What Activity and Fragment actually are in Android
What are the problems they solve, and what are their downsides
How to use a custom solution that simplifies navigation in Android applications
https://github.com/Zhuinden/navigation-example
This document discusses DOM selection and jQuery. It begins by explaining the DOM API and its levels. It then covers DOM selection methods like getElementById and querySelectorAll. It finds getElementById is typically fastest. The document also discusses CSS selectors and structural pseudo-classes. It shows querySelectorAll generally outperforms getElementsByTagName. Finally, it compares jQuery selector performance to native methods, finding native often faster, especially for structural pseudo-classes like :first-child versus jQuery's .first() method.
Single-page applications (SPAs) take user interaction with web applications to a new level. This means that more logic will be moved to the web browser and we have to become more familiar with JavaScript. AngularJS is one of the leading JavaScript frameworks when talking about SPAs. In this workshop I will present AngularJS in terms of problems it addresses and how it does this. Together we will develop a single-page application and we will go through how traditional concepts of web applications (data and state management, authentication) can be solved using the framework. Furthermore, we will dive into typical pitfalls when developing applications using AngularJS and will see how we can avoid them.
This document summarizes AngularJS scopes, digest cycles, data binding, dependency injection, and modularity. It discusses how scopes are created and inherited, how to use $digest and $watch, how expressions are evaluated, the benefits of dependency injection, and best practices for managing modules. Key recommendations include trusting the scope hierarchy, using $apply instead of $digest, avoiding non-isolated directives, and structuring code into independent, testable modules.
- Talk from FrontConf Munich 2017
- https://frontconf.com/talks/09-12-2017/reactive-type-safe-webcomponents
Abstract:
You know the drill right? new cool framework/library appears... boom! new Datepicker in that framework follows and soon enough whole UI libraries, again and again....
It's 2017 and it's time to stop this madness once and for all! How you ask?
In this talk we will go through implementation of an app via vanilla web components and explore all the pain points with all these low level primitives that we have natively in the browser.
In the end we will build our custom super tiny reactive type-safe library which will allow us to build web components with a breeze
Write once, use everywhere by using the platform + abstraction for great Developer experience.
28.03.15. Одесса. Impact Hub Odessa. Конференция JSLab.
Алексей Волков. "React на практике"
Доклад освещает практические аспекты использования React.js в различном окружении. React и модели Backbone. React и таблицы стилей, а также React в мобильном вебе. Будет полезно как и тем, кто только интересуется этой библиотекой, а также опытным разработчикам.
Подробнее:
http://geekslab.co/
https://www.facebook.com/GeeksLab.co
https://www.youtube.com/user/GeeksLabVideo
1. Attachment theory proposes that humans are pre-programmed to form attachments as infants in order to survive, and that early child-caregiver relationships form a prototype for later relationships.
2. Studies have shown that sensitive caregiving leads to secure attachment in infants, while unresponsive or inconsistent caregiving can result in insecure-avoidant or insecure-ambivalent attachment styles.
3. Securely attached children tend to have higher self-esteem and lower risk of depression into the future, while insecure attachment is associated with increased risks of mental health issues like anxiety, depression and personality disorders.
Dalia Sadany is an Egyptian architect and interior designer with extensive experience providing full-service turnkey design solutions through her company Dezines and its subsidiaries. She advocates for the master builder approach where a single architect is responsible for all aspects of a project from concept to completion. Dezines consists of divisions for design, construction, and custom furniture to holistically handle residential and commercial projects from start to finish.
The document provides tips for choosing the right contractor for a construction project. It recommends evaluating contractors based on their communication skills, problem-solving abilities, teamwork, and budgeting experience. Key steps include getting estimates from multiple contractors, comparing estimates, and choosing a contractor who is reputable, capable, and provides a fair price rather than necessarily the lowest bid. Thorough communication and getting a sense of the contractor's work habits and past clients' satisfaction are also important factors to consider.
Building Large Scale Javascript ApplicationAnis Ahmad
In recent years a number of libraries for building large JavaScript applications has appeared. As we no longer need to battle DOM differences between browsers we can finally focus on building highly interactive front-end applications instead. But before we can do a good job with these new libraries we need unlearn our previous DOM-centric approach and need to be aware of good practices and patterns of developing modern javascript app.
It will start with jQuery based old style practices and try to discuss on how can we approach to a modular, decoupled, scalable application architecture. This slide was prepared in very short time for technical session series of Digital World 2014 (http://www.digitalworld.org.bd/technical-session). The event video is here - https://www.youtube.com/watch?v=Gpw7l27MUUc (slide was not properly covered in video).
It has taken inspiration, ideas (, even some contents) from the following sources -
* http://addyosmani.com/largescalejavascript/
* http://addyosmani.com/resources/essentialjsdesignpatterns/book/
* https://www.youtube.com/watch?v=vXjVFPosQHw
* https://www.youtube.com/watch?v=qWr7x9wk6_c
* https://speakerdeck.com/kimjoar/patterns-of-large-scale-javascript-applications-1
jQquerysummit - Large-scale JavaScript Application Architecture Jiby John
The document discusses organizing jQuery and JavaScript applications using different patterns and frameworks. It begins by explaining design patterns and their benefits. It then covers using the Model-View-Controller (MVC) pattern with jQuery, providing examples of MVC frameworks. Finally, it discusses other JavaScript patterns for organizing code into reusable modules.
This document provides an overview of AngularJS, including its philosophy and architecture. AngularJS aims to simplify development by providing model-view-controller frameworks and dependency injection. It advocates for declarative code for building user interfaces rather than imperative code. The document also discusses AngularJS concepts like templates, scopes, models, repeaters, filters and custom directives to build single page applications.
Top 45 jQuery Interview Questions and Answers | EdurekaEdureka!
YouTube Link: https://youtu.be/nmX4ycVIXt8
** Full Stack Web Developer Masters Program: https://www.edureka.co/masters-program/full-stack-developer-training **
This Edureka PPT on "jQuery Interview Questions" will help you to prepare yourself for jQuery or web development interviews. Learn about the most important jQuery interview questions and answers and know what will set you apart in the interview process.
Follow us to never miss an update in the future.
YouTube: https://www.youtube.com/user/edurekaIN
Instagram: https://www.instagram.com/edureka_learning/
Facebook: https://www.facebook.com/edurekaIN/
Twitter: https://twitter.com/edurekain
LinkedIn: https://www.linkedin.com/company/edureka
Castbox: https://castbox.fm/networks/505?country=in
Five class-based views everyone has written by nowJames Aylett
This document discusses the use of class-based views in Django and some challenges that arise when implementing more complex view logic compared to function-based views. It introduces five class-based views for common CRUD operations and describes additional mixins and custom views created to address issues like creating objects that are related to or bound by other objects, updating multiple related objects at once, and paginating child objects on a detail view. Additional topics like permissions are also briefly mentioned.
AngularJS is a JavaScript MVC framework developed by Google in 2009. It uses HTML enhanced with directives to bind data to the view via two-way data binding. AngularJS controllers define application behavior by mapping user actions to the model. Core features include directives, filters, expressions, dependency injection and scopes that connect controllers and views. Services like $http are used to retrieve server data. AngularJS makes building single page applications easier by taking care of DOM updates automatically.
This document provides instructions on how to create a basic "Hello Widget" Android widget app. It discusses creating a new Android project, designing the widget layout with XML, adding code to the AppWidgetProvider to handle updates, and testing the widget. It also provides an example of adding interactivity by coding buttons on the widget and handling button clicks by launching an activity. The document history section lists the document versions and authors.
- React is a JavaScript library for building user interfaces created by Facebook that uses a component-based approach to building UIs with a focus on immutable data structures and one-way data flow.
- Major companies like Facebook, Instagram, AirBnB, and Khan Academy use React to build their user interfaces.
- React uses a virtual DOM for rendering components to optimize performance and allow for extremely fast render times compared to traditional approaches that directly manipulate the real DOM.
Creating the interfaces of the future with the APIs of todaygerbille
The document discusses creating futuristic interfaces using web technologies like WebSockets, WebGL, and device APIs. It provides examples of syncing device orientation over WebSockets between clients, accessing the device camera with getUserMedia, and using head tracking with headtrackr.js to control the camera in a 3D scene rendered with three.js. Links are included for related projects on Wiimote control, head tracking examples, and touch tracking demos.
Building Rich User Experiences Without JavaScript SpaghettiJared Faris
Jared Faris discusses how to build rich user experiences without messy JavaScript code. He advocates for decoupling JavaScript objects, writing small discrete chunks of code, and pushing events rather than state between objects. This avoids JavaScript spaghetti and promotes loose coupling between components. Design patterns like Mediator and Observer are useful, as are tools like Knockout and Backbone that help manage state, routing, and views. Testing discrete layers without HTML elements also helps produce clean, modular code.
Architecting Single Activity Applications (With or Without Fragments)Gabor Varadi
Presentation by Gabor Varadi (@zhuinden)
What Activity and Fragment actually are in Android
What are the problems they solve, and what are their downsides
How to use a custom solution that simplifies navigation in Android applications
https://github.com/Zhuinden/navigation-example
This document discusses DOM selection and jQuery. It begins by explaining the DOM API and its levels. It then covers DOM selection methods like getElementById and querySelectorAll. It finds getElementById is typically fastest. The document also discusses CSS selectors and structural pseudo-classes. It shows querySelectorAll generally outperforms getElementsByTagName. Finally, it compares jQuery selector performance to native methods, finding native often faster, especially for structural pseudo-classes like :first-child versus jQuery's .first() method.
Single-page applications (SPAs) take user interaction with web applications to a new level. This means that more logic will be moved to the web browser and we have to become more familiar with JavaScript. AngularJS is one of the leading JavaScript frameworks when talking about SPAs. In this workshop I will present AngularJS in terms of problems it addresses and how it does this. Together we will develop a single-page application and we will go through how traditional concepts of web applications (data and state management, authentication) can be solved using the framework. Furthermore, we will dive into typical pitfalls when developing applications using AngularJS and will see how we can avoid them.
This document summarizes AngularJS scopes, digest cycles, data binding, dependency injection, and modularity. It discusses how scopes are created and inherited, how to use $digest and $watch, how expressions are evaluated, the benefits of dependency injection, and best practices for managing modules. Key recommendations include trusting the scope hierarchy, using $apply instead of $digest, avoiding non-isolated directives, and structuring code into independent, testable modules.
- Talk from FrontConf Munich 2017
- https://frontconf.com/talks/09-12-2017/reactive-type-safe-webcomponents
Abstract:
You know the drill right? new cool framework/library appears... boom! new Datepicker in that framework follows and soon enough whole UI libraries, again and again....
It's 2017 and it's time to stop this madness once and for all! How you ask?
In this talk we will go through implementation of an app via vanilla web components and explore all the pain points with all these low level primitives that we have natively in the browser.
In the end we will build our custom super tiny reactive type-safe library which will allow us to build web components with a breeze
Write once, use everywhere by using the platform + abstraction for great Developer experience.
28.03.15. Одесса. Impact Hub Odessa. Конференция JSLab.
Алексей Волков. "React на практике"
Доклад освещает практические аспекты использования React.js в различном окружении. React и модели Backbone. React и таблицы стилей, а также React в мобильном вебе. Будет полезно как и тем, кто только интересуется этой библиотекой, а также опытным разработчикам.
Подробнее:
http://geekslab.co/
https://www.facebook.com/GeeksLab.co
https://www.youtube.com/user/GeeksLabVideo
1. Attachment theory proposes that humans are pre-programmed to form attachments as infants in order to survive, and that early child-caregiver relationships form a prototype for later relationships.
2. Studies have shown that sensitive caregiving leads to secure attachment in infants, while unresponsive or inconsistent caregiving can result in insecure-avoidant or insecure-ambivalent attachment styles.
3. Securely attached children tend to have higher self-esteem and lower risk of depression into the future, while insecure attachment is associated with increased risks of mental health issues like anxiety, depression and personality disorders.
Dalia Sadany is an Egyptian architect and interior designer with extensive experience providing full-service turnkey design solutions through her company Dezines and its subsidiaries. She advocates for the master builder approach where a single architect is responsible for all aspects of a project from concept to completion. Dezines consists of divisions for design, construction, and custom furniture to holistically handle residential and commercial projects from start to finish.
The document provides tips for choosing the right contractor for a construction project. It recommends evaluating contractors based on their communication skills, problem-solving abilities, teamwork, and budgeting experience. Key steps include getting estimates from multiple contractors, comparing estimates, and choosing a contractor who is reputable, capable, and provides a fair price rather than necessarily the lowest bid. Thorough communication and getting a sense of the contractor's work habits and past clients' satisfaction are also important factors to consider.
1. Attachment theory proposes that humans are pre-programmed to form attachments as infants in order to survive, and that these early child-caregiver relationships form internal working models that influence later relationships.
2. Ainsworth's strange situation experiment identified patterns of secure, avoidant, and resistant attachment in infants based on the sensitivity of caregivers. Securely attached infants explored when caregivers were present and were comforted by their return.
3. Bowlby theorized that internal working models formed from early attachments influence views of self and others and the ability to form stable relationships later in life. Insecure attachments can lead to difficulties with intimacy and dependence.
Este documento habla sobre la innovación empresarial y los tipos de innovación. Define la innovación empresarial como mejoras al modelo de negocio de una empresa para ser más eficiente y obtener una mejor posición en el mercado. Explica cuatro tipos de innovación: en el modelo de negocio, en alianzas estratégicas, en procesos de soporte al negocio, y en procesos clave de negocio. También clasifica las empresas por sectores económicos e introduce la metodología inductiva y de estadística descriptiva que se util
Ada Lovelace fue una matemática y escritora británica reconocida principalmente por su trabajo sobre la máquina analítica de Charles Babbage, la cual sería un precursor de la computadora moderna. En 1843, Lovelace tradujo un artículo sobre la máquina analítica y añadió notas extensas donde describió el primer algoritmo destinado a ser procesado por una máquina, siendo considerada la primera programadora de computadoras. Además, dedujo la capacidad de las computadoras para ir más allá de simples cálculos numéricos.
Play, including games and toys, is an important part of learning and development for both children and adults. While toys are often associated with children's play, games can be enjoyed by both children and adults. Play helps develop important skills like problem-solving, hand-eye coordination, and stress relief. Introducing science and technology concepts through games and play can spark children's interest in continuing to learn through out-of-school programs. Using toys and games of increasing difficulty in a progressive way can support learning new topics and integrating different areas of study.
jquery summit presentation for large scale javascript applicationsDivyanshGupta922023
The document discusses different patterns for organizing JavaScript applications, including the module pattern and MVC frameworks. It provides examples of implementing the module pattern in jQuery, Dojo, YUI, and ExtJS. It also covers MVC frameworks like Backbone.js, AngularJS, and Ember and discusses how to convert existing code to an MVC structure.
Building React Applications with Redux
with Yuri Takhteyev
OVERVIEW
Since React is just a “view framework”, it leaves you with lots of options for how to architect the deeper parts of your stack. The best way to handle those deeper layers is by using Redux – a state container that allows you to write much of your application in the form of pure functions. Using Redux helps you write applications that are much easier to test and understand and to achieve more thorough separation between your views and your business logic. Redux also unlocks the possibility of using amazing tools.
OBJECTIVE
Introduce the audience to Redux, a state container that can be used together with React to achieve sanity deeper down in your stack.
TARGET AUDIENCE
Developers familiar with core React and looking for a better way to architect their applications.
ASSUMED AUDIENCE KNOWLEDGE
Core React knowledge is assumed. Familiarity with basic Flux concepts would help, but I’ll review those quickly.
FIVE THINGS AUDIENCE MEMBERS WILL LEARN
Why pure functions make your code easier to maintain.
How unidirectional data flows help you sleep better at night.
How Redux helps you manage state better via reducers.
How to use Redux together with React.
How to test Redux applications.
Developing large scale JavaScript applicationsMilan Korsos
Developing large scale JavaScript applications
24/11/11 @ Front end meetup, Budapest (Hungary)
www.milankorsos.com
www.twitter.com/korsosm
www.sowink.com
Yeoman AngularJS and D3 - A solid stack for web appsclimboid
This was a course given in Bangalore India for JSChannel conf 2013. It encompases the use of angular js and d3 in a harmonious way and gives an overview over each of the frameworks / libraries.
The document discusses the front-end architecture at CrowdTwist, which uses different frameworks and tools across apps. This has led to growing pains as the codebase becomes harder to maintain and develop for new features. The document explores how frameworks can simplify development but also introduce complexity. It argues that React offers a simpler approach through isolated components and predictable rendering of state changes. React could help unify CrowdTwist's front-end by replacing some uses of Backbone and Angular.
Advanced Memory Management on iOS and Android - Mark Probst and Rodrigo KumperaXamarin
The document discusses advanced memory management techniques on mobile platforms. It begins with an overview of how garbage collectors work by computing which objects are reachable and freeing unreachable objects. It then discusses specific techniques for iOS and Android like generational garbage collection, stop-the-world pauses, and avoiding indirect cycles through weak references. Finally, it provides examples of common memory issues and how to address them, such as ensuring unmanaged resources are properly disposed.
PhoneGap Training - Optimus Prime
"More computing sins are committed in the name of efficiency (without necessarily achieving it) than for any other single reason — including blind stupidity."
— W.A. Wulf
The document discusses various design patterns and best practices for building multipage applications with Backbone.js, including scoping selectors with views, using a file structure with folders for models, views etc., templates, template sharing between client and server, view injection, view helpers, bootstrapping data, mixins, parent-child views, two-way data binding with stickit, and an overview of Marionette.js which provides additional structure to Backbone apps.
Slides of a talk of a seminars series I gave at WebRatio in January 2014.
I implemented many best practices and advices in this presentation in a generic app template available here: https://github.com/iivanoo/cordovaboilerplate
MVC Design Pattern in JavaScript by ADMEC Multimedia InstituteRavi Bhadauria
This presentation is one of the best presentations from our study material for our JavaScript Object Oriented workshops which ADMEC conducts every week at the
center.
In this presentation, Prashant Sharma of Valuebound has talked about ReactJS - a JavaScript library for building user interfaces. Check out the agendas to know what is there for you.
----------------------------------------------------------
Get Socialistic
Our website: http://valuebound.com/
LinkedIn: http://bit.ly/2eKgdux
Facebook: https://www.facebook.com/valuebound/
Twitter: http://bit.ly/2gFPTi8
Intro to React - Featuring Modern JavaScriptjasonsich
This document summarizes React, a JavaScript library for building user interfaces. It discusses key React concepts like the virtual DOM, one-way data flow, components, ES6 support, Flux architecture, testing with Jest, mixins, and isomorphic JavaScript. Tools mentioned include Babel, Browserify, Gulp, and Webpack. Examples provided are a meal planner app using Webpack and one using Browserify.
A case study of the changes and transition from ZF1 to ZF2 in the Zend Server UI project in Webinar form: http://www.zend.com/en/webinar/Framework/70170000000bwxn-ZSVR6UI-ZF2-20130129.flv
1) The document discusses reactivity in modern frontend frameworks like Angular, React, and Vue.
2) It explains the different approaches to reactivity including Angular's use of Zone.js for change detection, React's functional components approach, and Vue's reactive state.
3) The document also covers alternatives within frameworks like OnPush change detection in Angular and using observables, as well as design patterns like separating state from components.
Bringing the light to the client with KnockoutJSBoyan Mihaylov
This document provides an overview of a presentation on using KnockoutJS. It introduces KnockoutJS as an MVVM JavaScript library, discusses key concepts like declarative bindings and dependency tracking, and demonstrates how to work with observables, computed values, templates and custom bindings. The presentation emphasizes the benefits of separating data and display with MV* patterns and explains how KnockoutJS enables this separation through its declarative bindings and automatic UI updating.
The document discusses reactivity in modern frontend frameworks like Angular, React, and Vue. It begins with an introduction to reactive programming concepts. It then provides an overview of the baseline reactivity mechanisms in Angular using Zone.js change detection, and in React using function components and state updates. Alternative reactivity options in Angular like OnPush change detection and observables are presented. The document also covers reactive state management in Vue using reactive proxies and computed properties. Code examples are provided to demonstrate reactivity in each framework.
Will your code blend? : Toronto Code Camp 2010 : Barry GervinBarry Gervin
XAML getting you down? Tired of the repetition of trial by error WPF or Silverlight development? If you’re not using Expression Blend to build your XAML, you’re doing it all wrong. Let’s take a look at the common pitfalls that new Silverlight developers fall into that make their code unblendable, and then leverage the patterns and techniques that allow us to unlock the virtues of Expression Blend. Testability, blendability, inner peace and maintainability are just 1 hour away
This document discusses building rich web applications using ASP.NET MVC 2. It includes 4 exercises:
1. Adding metadata attributes to model entities to help render them in views. This includes attributes like DisplayName and DataType.
2. Modifying markup in a view to make use of new strongly-typed HTML helpers like LabelFor and DisplayFor.
3. Creating a metadata class to store attributes for rendering an activity entity, including using the MetadataType attribute.
4. Learning how to use templates in ASP.NET MVC 2 to help render model properties, including creating a template for the activity rating property.
Adding a modern twist to legacy web applicationsJeff Durta
Avoid misery of working with legacy code
We will see how you can add independent and isolated components to existing pages; pages that may be difficult to change
React and Flux allow you to make self-contained additions that handle their own data access/persistence
Getting the Most Out of ScyllaDB Monitoring: ShareChat's TipsScyllaDB
ScyllaDB monitoring provides a lot of useful information. But sometimes it’s not easy to find the root of the problem if something is wrong or even estimate the remaining capacity by the load on the cluster. This talk shares our team's practical tips on: 1) How to find the root of the problem by metrics if ScyllaDB is slow 2) How to interpret the load and plan capacity for the future 3) Compaction strategies and how to choose the right one 4) Important metrics which aren’t available in the default monitoring setup.
AppSec PNW: Android and iOS Application Security with MobSFAjin Abraham
Mobile Security Framework - MobSF is a free and open source automated mobile application security testing environment designed to help security engineers, researchers, developers, and penetration testers to identify security vulnerabilities, malicious behaviours and privacy concerns in mobile applications using static and dynamic analysis. It supports all the popular mobile application binaries and source code formats built for Android and iOS devices. In addition to automated security assessment, it also offers an interactive testing environment to build and execute scenario based test/fuzz cases against the application.
This talk covers:
Using MobSF for static analysis of mobile applications.
Interactive dynamic security assessment of Android and iOS applications.
Solving Mobile app CTF challenges.
Reverse engineering and runtime analysis of Mobile malware.
How to shift left and integrate MobSF/mobsfscan SAST and DAST in your build pipeline.
Conversational agents, or chatbots, are increasingly used to access all sorts of services using natural language. While open-domain chatbots - like ChatGPT - can converse on any topic, task-oriented chatbots - the focus of this paper - are designed for specific tasks, like booking a flight, obtaining customer support, or setting an appointment. Like any other software, task-oriented chatbots need to be properly tested, usually by defining and executing test scenarios (i.e., sequences of user-chatbot interactions). However, there is currently a lack of methods to quantify the completeness and strength of such test scenarios, which can lead to low-quality tests, and hence to buggy chatbots.
To fill this gap, we propose adapting mutation testing (MuT) for task-oriented chatbots. To this end, we introduce a set of mutation operators that emulate faults in chatbot designs, an architecture that enables MuT on chatbots built using heterogeneous technologies, and a practical realisation as an Eclipse plugin. Moreover, we evaluate the applicability, effectiveness and efficiency of our approach on open-source chatbots, with promising results.
LF Energy Webinar: Carbon Data Specifications: Mechanisms to Improve Data Acc...DanBrown980551
This LF Energy webinar took place June 20, 2024. It featured:
-Alex Thornton, LF Energy
-Hallie Cramer, Google
-Daniel Roesler, UtilityAPI
-Henry Richardson, WattTime
In response to the urgency and scale required to effectively address climate change, open source solutions offer significant potential for driving innovation and progress. Currently, there is a growing demand for standardization and interoperability in energy data and modeling. Open source standards and specifications within the energy sector can also alleviate challenges associated with data fragmentation, transparency, and accessibility. At the same time, it is crucial to consider privacy and security concerns throughout the development of open source platforms.
This webinar will delve into the motivations behind establishing LF Energy’s Carbon Data Specification Consortium. It will provide an overview of the draft specifications and the ongoing progress made by the respective working groups.
Three primary specifications will be discussed:
-Discovery and client registration, emphasizing transparent processes and secure and private access
-Customer data, centering around customer tariffs, bills, energy usage, and full consumption disclosure
-Power systems data, focusing on grid data, inclusive of transmission and distribution networks, generation, intergrid power flows, and market settlement data
What is an RPA CoE? Session 1 – CoE VisionDianaGray10
In the first session, we will review the organization's vision and how this has an impact on the COE Structure.
Topics covered:
• The role of a steering committee
• How do the organization’s priorities determine CoE Structure?
Speaker:
Chris Bolin, Senior Intelligent Automation Architect Anika Systems
How information systems are built or acquired puts information, which is what they should be about, in a secondary place. Our language adapted accordingly, and we no longer talk about information systems but applications. Applications evolved in a way to break data into diverse fragments, tightly coupled with applications and expensive to integrate. The result is technical debt, which is re-paid by taking even bigger "loans", resulting in an ever-increasing technical debt. Software engineering and procurement practices work in sync with market forces to maintain this trend. This talk demonstrates how natural this situation is. The question is: can something be done to reverse the trend?
MySQL InnoDB Storage Engine: Deep Dive - MydbopsMydbops
This presentation, titled "MySQL - InnoDB" and delivered by Mayank Prasad at the Mydbops Open Source Database Meetup 16 on June 8th, 2024, covers dynamic configuration of REDO logs and instant ADD/DROP columns in InnoDB.
This presentation dives deep into the world of InnoDB, exploring two ground-breaking features introduced in MySQL 8.0:
• Dynamic Configuration of REDO Logs: Enhance your database's performance and flexibility with on-the-fly adjustments to REDO log capacity. Unleash the power of the snake metaphor to visualize how InnoDB manages REDO log files.
• Instant ADD/DROP Columns: Say goodbye to costly table rebuilds! This presentation unveils how InnoDB now enables seamless addition and removal of columns without compromising data integrity or incurring downtime.
Key Learnings:
• Grasp the concept of REDO logs and their significance in InnoDB's transaction management.
• Discover the advantages of dynamic REDO log configuration and how to leverage it for optimal performance.
• Understand the inner workings of instant ADD/DROP columns and their impact on database operations.
• Gain valuable insights into the row versioning mechanism that empowers instant column modifications.
Lee Barnes - Path to Becoming an Effective Test Automation Engineer.pdfleebarnesutopia
So… you want to become a Test Automation Engineer (or hire and develop one)? While there’s quite a bit of information available about important technical and tool skills to master, there’s not enough discussion around the path to becoming an effective Test Automation Engineer that knows how to add VALUE. In my experience this had led to a proliferation of engineers who are proficient with tools and building frameworks but have skill and knowledge gaps, especially in software testing, that reduce the value they deliver with test automation.
In this talk, Lee will share his lessons learned from over 30 years of working with, and mentoring, hundreds of Test Automation Engineers. Whether you’re looking to get started in test automation or just want to improve your trade, this talk will give you a solid foundation and roadmap for ensuring your test automation efforts continuously add value. This talk is equally valuable for both aspiring Test Automation Engineers and those managing them! All attendees will take away a set of key foundational knowledge and a high-level learning path for leveling up test automation skills and ensuring they add value to their organizations.
ScyllaDB is making a major architecture shift. We’re moving from vNode replication to tablets – fragments of tables that are distributed independently, enabling dynamic data distribution and extreme elasticity. In this keynote, ScyllaDB co-founder and CTO Avi Kivity explains the reason for this shift, provides a look at the implementation and roadmap, and shares how this shift benefits ScyllaDB users.
AI in the Workplace Reskilling, Upskilling, and Future Work.pptxSunil Jagani
Discover how AI is transforming the workplace and learn strategies for reskilling and upskilling employees to stay ahead. This comprehensive guide covers the impact of AI on jobs, essential skills for the future, and successful case studies from industry leaders. Embrace AI-driven changes, foster continuous learning, and build a future-ready workforce.
Read More - https://bit.ly/3VKly70
inQuba Webinar Mastering Customer Journey Management with Dr Graham HillLizaNolte
HERE IS YOUR WEBINAR CONTENT! 'Mastering Customer Journey Management with Dr. Graham Hill'. We hope you find the webinar recording both insightful and enjoyable.
In this webinar, we explored essential aspects of Customer Journey Management and personalization. Here’s a summary of the key insights and topics discussed:
Key Takeaways:
Understanding the Customer Journey: Dr. Hill emphasized the importance of mapping and understanding the complete customer journey to identify touchpoints and opportunities for improvement.
Personalization Strategies: We discussed how to leverage data and insights to create personalized experiences that resonate with customers.
Technology Integration: Insights were shared on how inQuba’s advanced technology can streamline customer interactions and drive operational efficiency.
Essentials of Automations: Exploring Attributes & Automation ParametersSafe Software
Building automations in FME Flow can save time, money, and help businesses scale by eliminating data silos and providing data to stakeholders in real-time. One essential component to orchestrating complex automations is the use of attributes & automation parameters (both formerly known as “keys”). In fact, it’s unlikely you’ll ever build an Automation without using these components, but what exactly are they?
Attributes & automation parameters enable the automation author to pass data values from one automation component to the next. During this webinar, our FME Flow Specialists will cover leveraging the three types of these output attributes & parameters in FME Flow: Event, Custom, and Automation. As a bonus, they’ll also be making use of the Split-Merge Block functionality.
You’ll leave this webinar with a better understanding of how to maximize the potential of automations by making use of attributes & automation parameters, with the ultimate goal of setting your enterprise integration workflows up on autopilot.
QA or the Highway - Component Testing: Bridging the gap between frontend appl...zjhamm304
These are the slides for the presentation, "Component Testing: Bridging the gap between frontend applications" that was presented at QA or the Highway 2024 in Columbus, OH by Zachary Hamm.
GraphRAG for LifeSciences Hands-On with the Clinical Knowledge Graph
Gitter marionette deck
1.
2. Who are these dudes?
suprememoocow
mydigitalself
Andrew Newdigate
Mike Bartlett
3. Gitter is where
developers come to talk
120 000 registered users
24 000 public communities
Active every minute of every day
502 releases in 1.5 years
4. Zawinksi’s Law
Every program attempts to expand until it can read mail.
Those programs which cannot so expand are replaced by ones which can.
10. Finding performance problems
Don’t optimise too early
Focus on CollectionViews, CompositeViews
Improving the performance 1000% on a view that gets rendered once in
the application isn’t going to make the slightest bit of difference.
12. Example of
using Timelines
$.tooltip is really slow
Solution: change the tooltip
behaviour to only initialise the
tooltip on the first mouseover event
fired on the element
1ms per tooltip to 0.005ms per
tooltip
13. Easy performance win: attachElContent
Override this method in your collection/composite child views
// Abbreviated version of the attachElContent MixIn we use on Gitter
attachElContent: function(html) {
if (typeof html === 'string') {
this.el.innerHTML = html;
return this;
}
this.$el.html(html);
return this;
}
16. Pre-rendering is good practice
Page indexing / SEO advantages to doing it
Perceived speed of page load is much faster
Avoid multiple reflows as the application loads
Less jankiness
17. Pre-rendering is messy
At the moment, done through a series of hacks:
• Server-side handlebars helpers
• Client-side Marionette extensions
Would be awesome to move this out into a semi-sane, open-source
library (or build it into Marionette!)
19. Isomorphic LayoutViews
In LayoutView’s before:show event
• If the region is empty, initialise ChildView as per normal:
• If the region already contains content, mount the ChildView on the
existing element:
view.showChildView(regionName,
new ChildView({ el: existingElement, template: false, ... options ... }));
view.showChildView(regionName, new ChildView({ ... options ... }));
20. Isomorphic CollectionViews
childViewOptions: function (model) {
if (!model.id) return;
var el = this.$el.find('> [data-id="' + model.id + '"]')[0];
if (!el) return;
return {
el: el,
template: false
};
},
<ul>
<li data-id="1">One</li>
<li data-id="2">Two</li>
<li data-id="3">Three</li>
</ul>
collection.reset([
{ id: “1”, name: “One” },
{ id: “2”, name: “Two” },
{ id: “3”, name: “Three” }
]);
24. People Roster Data
~300 characters
In a 5000 user room, that’s 1.4MB of JSON
Retina and non-retina avatar URLs
Unused fields, duplicate data, etc
{
"id": "5298e2d5ed5ab0b3bf04c980",
"username": "suprememoocow",
"displayName": "Andrew Newdigate",
"url": "/suprememoocow",
"avatarUrlSmall": "https://avatars1.githubuser
"avatarUrlMedium": "https://avatars1.githubuse
"gv": "3",
"v": 30
}
25. How we represent them now
77 characters
In a 5000 user room, that’s still 375KB.
Limit the list to the first 20 people
{
"id": "5298e2d5ed5ab0b3bf04c980",
"username": "suprememoocow",
"gv": "3",
"v": 30
}
27. .on is a code smell
Using jquery events
Backbone events
Also, beware of long running setTimeouts
this.ui.actionButton.on('click', function() {
window.alert('Yo');
});
this.model.on('change', function() {
window.alert('Yo');
});
28. Obvious solution
Use modelEvents, collectionEvents and events
modelEvents: {
'change': 'onChange'
},
events: {
'click @ui.badge': 'onBadgeClicked'
},
collectionEvents: {
'add reset sync reset': 'showHideHeader'
},
Use listenTo for listening to Backbone.Events
this.listenTo(model, 'change', function() { })
29. When you still need .on
Remember to cleanup after yourself
onClick: function() {
this.$someElement.on('mouseenter', ...);
this.longRunningTimer = setTimeout(function() {}, 60000);
},
onDestroy: function() {
this.$someElement.off();
clearTimeout(this.longRunningTimer);
},
33. MV* 101
This is how we’re taught to
structure MV* applications
at school.
34. Sometimes it’s easier to ignore the advice
We need to tell another view to do
something.
We’re in a rush, so we’ll just wire the
dependency in and fix it later.
var MyView = Mn.ItemView.extend({
...
onActionClicked: function() {
this.options.anotherView.doSomething();
},
})
var myView = new MyView({ anotherView:
anotherView });
36. This makes change hard
Just try to:
• Move a view within the view hierarchy
• Remove a view in a certain environment
(unauthenticated view, mobile, etc)
Let’s change things
around a bit…
40. Quick and dirty
A component needs to respond to an action and change another
component’s DOM…
Easiest solution: just use jquery
onClick: function() {
$('#action-button').hide();
}
41. c/c++ pointer arithmetic
In c/c++, it’s possible to use pointer arithmetic to directly modify the
contents of a location in memory.
I’m sure you will all agree: this is a VERY BAD IDEA!
bptr = (byte*) &data;
bptr = bptr + 5;
iptr = (int*) bptr;
(*iptr) = 0xcafebabe;
42. Now imagine…
Your DOM is a global memory shared by all the Javascript code running
in your app
Each view in your app manages a distinct piece of the global memory
Mutating another view’s DOM is a bit like using pointer arithmetic to
change it’s memory behind it’s back
Don’t do it!
45. Then
Client: AMD modules with RequireJS
Tests: run in a phantomjs
Server: commonjs modules with nodejs
Tests run in nodejs with mocha
46. Now
Client: commonjs modules with webpack
Server: commonjs modules with nodejs
Shared code is kept in shared
Shared code can be tested quickly using the nodejs and mocha, without
having to start a phantomjs browser
47. require.ensure();
// In your backbone router....
markdown: function() {
require.ensure(['views/markdown/markdownView'], function(require) {
var MarkdownView = require('views/markdown/markdownView');
appView.dialogRegion.show(new MarkdownView({}));
});
},
49. Code Debt
A lot of these problems as the result of technical debt. When we started
building the project we chose Backbone, and only later did we switch to
Marionette.
Initially, we treated Marionette as a neat extension of Backbone, for
things like CollectionViews etc so the transition was gradual and left a
lot of technical debt around.
Marionette 2 PR
50. From a small prototype to a large application
A lot of the pain we’ve experienced has been down to the fact that we
started off with a small application which has grown larger and larger.
Start as you mean to go on