background preloader

MVVM (Model View ViewModel)

MVVM (Model View ViewModel)
MVVM facilitates a clear separation of the development of the graphical user interface (either as markup language or GUI code) from the development of the business logic or back end logic known as the model (also known as the data model to distinguish it from the view model). The view model of MVVM is a value converter[4] meaning that the view model is responsible for exposing the data objects from the model in such a way that those objects are easily managed and consumed. In this respect, the view model is more model than view, and handles most if not all of the view’s display logic (though the demarcation between what functions are handled by which layer is a subject of ongoing discussion[5] and exploration). The view model may also implement a mediator pattern organising access to the backend logic around the set of use cases supported by the view. History[edit] Microsoft MVP Josh Smith reported[6] that A notable Javascript implementation of this pattern is Knockout.js. Timeline[edit] Related:  AJAX

Learning JavaScript Design Patterns Design patterns are reusable solutions to commonly occurring problems in software design. They are both exciting and a fascinating topic to explore in any programming language. One reason for this is that they help us build upon the combined experience of many developers that came before us and ensure we structure our code in an optimized way, meeting the needs of problems we're attempting to solve. Design patterns also provide us a common vocabulary to describe solutions. This can be significantly simpler than describing syntax and semantics when we're attempting to convey a way of structuring a solution in code form to others. In this book we will explore applying both classical and modern design patterns to the JavaScript programming language. Target Audience This book is targeted at professional developers wishing to improve their knowledge of design patterns and how they can be applied to the JavaScript programming language. Acknowledgments Credits Reading We already use patterns everyday

MVP (Model View Presenter) Model–view–presenter (MVP) is a derivative of the model–view–controller (MVC) software pattern, also used mostly for building user interfaces. In MVP the presenter assumes the functionality of the "middle-man" (played by the controller in MVC, although it must not be assumed that the presenter and controller play the same role[citation needed]). In MVP, all presentation logic is pushed to the presenter.[1] Eventually, the model becomes strictly a domain model. Pattern description[edit] Normally, the view implementation instantiates the concrete presenter object, providing a reference to itself. public class DomainView : IDomainView { private IDomainPresenter domainPresenter = null; ///<summary>Constructor</summary> public DomainView() { domainPresenter = new ConcreteDomainPresenter(this); }} The degree of logic permitted in the view varies among different implementations. Implementation in .NET[edit] The .NET environment supports the MVP pattern much like any other development environment.

MVC (Model View Controller) Model–view–controller (MVC) is a software pattern for implementing user interfaces. It divides a given software application into three interconnected parts, so as to separate internal representations of information from the ways that information is presented to or accepted from the user.[1][2] The central component, the model, consists of application data, business rules, logic and functions. A view can be any output representation of information, such as a chart or a diagram. Multiple views of the same information are possible, such as a bar chart for management and a tabular view for accountants. Component interactions[edit] A typical collaboration of the MVC components In addition to dividing the application into three kinds of components, the Model–view–controller (MVC) design defines the interactions between them.[4] Use in web applications[edit] History[edit] See also[edit] References[edit] External links[edit]

EMVC e|MVC is a JavaScript-based open source Model–View–Controller (MVC) framework, which includes an extensive JavaScript object library and a collection of widgets in the free download. The core e|MVC object bootstraps a model/controller combination for corresponding configured view objects. Utilizing a factory pattern, models and controllers are dynamically instantiated with the help of the dojo.query() method utilizing a lazy load approach in a compact file. The framework relies heavily on Dojo Toolkit 1.4+, and is tightly integrated with the e|Objects JavaScript library. The simple object interface allows for the easy incorporation of other useful third-party libraries, such as jQuery, sIFR, and MooTools. e|MVC is licensed under the MIT (X11) license and is subject to license terms of numerous incorporated Open Source components. History[edit] External links[edit]

Single-page application A single-page application (SPA) is a web application or web site that fits on a single web page with the goal of providing a more fluid user experience akin to a desktop application. In a SPA, either all necessary code – HTML, JavaScript, and CSS – is retrieved with a single page load,[1] or the appropriate resources are dynamically loaded and added to the page as necessary, usually in response to user actions. The page does not reload at any point in the process, nor does control transfer to another page, although modern web technologies (such as those included in the HTML5 pushState() API) can provide the perception and navigability of separate logical pages in the application. Interaction with the single page application often involves dynamic communication with the web server behind the scenes. History[edit] Modern browsers that can parse HTML5 allow developers to shift the user interface (UI) and application logic from web servers to the client. Technical approaches[edit] AJAX[edit]

User agent User agent identification[edit] In HTTP, the User-Agent string is often used for content negotiation, where the origin server selects suitable content or operating parameters for the response. For example, the User-Agent string might be used by a web server to choose variants based on the known capabilities of a particular version of client software. The User-Agent string is one of the criteria by which Web crawlers may be excluded from accessing certain parts of a Web site using the Robots Exclusion Standard (robots.txt file). Possible privacy issue[edit] As with many other HTTP request headers, the information in the "User-Agent" string contributes to the information that the client sends to the server, since the string can vary considerably from user to user.[3] Format for human-operated web browsers[edit] The User-Agent string format is currently specified by Section 14.43 of RFC 2616 (HTTP/1.1). Product name and version (WikiBrowser/1.0)Layout engine and version (Gecko/1.0).

W3C Document Object Model What's new? 20090106: The WebApps WG Drives DOM Specifications. The W3C Web Applications Working Group has taken over responsibility for the Document Object Model specifications, including a new revision of DOM Level 3 Events, a new DOM Core specification, and potentially any errata on older DOM specifications. Discussion can be directed to either the or the mailing lists. 20080122: The Document Object Model Activity is closed. The Document Object Model Working Group was closed in the Spring of 2004, after the completion of the DOM Level 3 Recommendations. Several W3C Working Groups have since taken the lead in maintaining and continuing to develop standard APIs for the Web since then; HTML, SVG, CSS, or WebAPI being among them. W3C's DOM news are also available as a RSS feed . What is the Document Object Model? Why the Document Object Model? W3C Activity Statement on the Document Object Model Public Release of Specifications

Document Object Model Hierarchy of objects in an example HTML DOM—Document Object Model Legacy DOM[edit] Intermediate DOM[edit] In 1997, Netscape and Microsoft released version 4.0 of Netscape Navigator and Internet Explorer respectively, adding support for Dynamic HTML (DHTML), functionality enabling changes to a loaded HTML document. Standardization[edit] The World Wide Web Consortium (W3C), founded in 1994 to promote open standards for the World Wide Web, brought Netscape Communications and Microsoft together with other companies to develop a standard for browser scripting languages, called "ECMAScript." After the release of ECMAScript, W3C began work on a standardized DOM. DOM Level 2 was published in late 2000. DOM Level 3, the current release of the DOM specification, published in April 2004, added support for XPath and keyboard event handling, as well as an interface for serializing documents as XML. DOM Level 4 is currently being developed. Applications[edit] Web browsers[edit] Implementations[edit]

Web application A web application or web app is any software that runs in a web browser. It is created in a browser-supported programming language (such as the combination of JavaScript, HTML and CSS) and relies on a web browser to render the application.[1][2][3] History[edit] In earlier computing models, e.g. in client-server, the load for the application was shared between code on the server and code installed on each client locally. In other words, an application had its own client program which served as its user interface and had to be separately installed on each user's personal computer. In contrast, web applications use web documents written in a standard format such as HTML and JavaScript, which are supported by a variety of web browsers. In 1995 Netscape introduced a client-side scripting language called JavaScript allowing programmers to add some dynamic elements to the user interface that ran on the client side. Interface[edit] Structure[edit] Business use[edit] Writing web applications[edit]

Web browser A web browser (commonly referred to as a browser) is a software application for retrieving, presenting and traversing information resources on the World Wide Web. An information resource is identified by a Uniform Resource Identifier (URI/URL) and may be a web page, image, video or other piece of content.[1] Hyperlinks present in resources enable users easily to navigate their browsers to related resources. Although browsers are primarily intended to use the World Wide Web, they can also be used to access information provided by web servers in private networks or files in file systems. History The first web browser was invented in 1990 by Sir Tim Berners-Lee. It was called WorldWideWeb and was later renamed Nexus.[3] The first commonly available web browser with a graphical user interface was Erwise. Microsoft responded with its Internet Explorer in 1995, also heavily influenced by Mosaic, initiating the industry's first browser war. Business models Function Features User interface Components

Comparison of layout engines (Scalable Vector Graphics) The following tables compare SVG compatibility and support for a number of layout engines. Please see the individual products' articles for further information. Unless otherwise specified in footnotes, comparisons are based on the stable versions without any add-ons, extensions or external programs. Explanation of the tables[edit] Engine nomenclature[edit] Rather than the names of web browsers, the names of the underlying engines are used. Values[edit] Values indicate the level of support in the most recent version of the layout engine, or (if a version number is given) in the specified version. This table shows support status of different ways of embedding SVG into HTML, for different layout engines. Comparison of various Scalable Vector Graphics element support.

Scalable Vector Graphics Scalable Vector Graphics (SVG) is an XML-based vector image format for two-dimensional graphics with support for interactivity and animation. The SVG specification is an open standard developed by the World Wide Web Consortium (W3C) since 1999. SVG images and their behaviors are defined in XML text files. Overview[edit] This image illustrates the difference between bitmap and vector images. SVG has been in development since 1999 by a group of companies within the W3C after the competing standards Precision Graphics Markup Language (PGML, developed from Adobe's PostScript) and Vector Markup Language (VML, developed from Microsoft's RTF) were submitted to W3C in 1998. Since 2001, the SVG specification has been updated to version 1.1. Work is currently in progress on SVG 2, which incorporates several new features in addition to those of SVG 1.1 and SVG Tiny 1.2. Printing[edit] Scripting and animation[edit] SVG drawings can be dynamic and interactive. Compression[edit] Development history[edit]

WebKit WebKit is available under a BSD-form license[11] with the exception of the WebCore and JavaScriptCore components, which are available under the GNU Lesser General Public License. As of March 7, 2013, WebKit is a trademark of Apple, registered with the U.S. Patent and Trademark Office.[12] Origins[edit] According to Apple, some changes involved OS X-specific features (e.g., Objective-C, KWQ,[15] OS X calls) that are absent in KDE's KHTML, which called for different development tactics.[16] Split development[edit] The exchange of code between WebCore and KHTML became increasingly difficult as the code base diverged because both projects had different approaches in coding and code sharing.[17] At one point KHTML developers said they were unlikely to accept Apple's changes and claimed the relationship between the two groups was a "bitter failure".[18] Apple submitted their changes in large patches containing very many changes with inadequate documentation, often to do with future additions.