apprun - AppRun is a 3K library for developing high-performance and reliable web applications using the elm inspired architecture, events and components

  •        30

AppRun is a 3K library for building high-performance and reliable web applications using the Elm inspired Architecture, event pub-sub and components. Application logic is broken down into three separated parts in the AppRun architecture.

https://github.com/yysun/apprun#readme
https://github.com/yysun/apprun

Dependencies:

commander : ^2.16.0

Tags
Implementation
License
Platform

   




Related Projects

functional-frontend-architecture - A functional frontend framework.

  •    Javascript

This repository is meant to document and explore the implementation of what is known as "the Elm architecture". A simple functional architecture for building frontend applications. The entire state is contained in a single data structure. Things can happen and the state should change accordingly. The number of things that can happen is described as a set of actions. Actions flow unidirectionally down the application. Actions are handled by pure update functions. Such a function takes an action and a state and returns a new state. The state is handed to a view function that returns a virtual DOM representation. A module is an encapsulated set of actions, an update function and a view function. Modules can be nested inside other modules and modules can contain other modules. This makes the architecture nestable and modular.

Bobril - Component oriented framework inspired by Mithril and ReactJs (already usable)

  •    TypeScript

Component oriented framework inspired by ReactJs (Virtual DOM, components with state) and Mithril (small size, more complete framework). Compared to ReactJS Added speeeed, autoprefixer, CSS in JS, router, additional livecycle methods, only rAF based repaint. Bobril ignores Isomorphic JavaScript, because it would increase size and is not needed for SEO anyway (Google bot supports JavaScript). Client applications are expected to be written in TypeScript. Because it is heavily used in production, backward compatibility is king. Any new feature must be optional or its perceived value to minified size ratio must be high enough. It is intended to be used with bobril-build.

elmish - Elm-like abstractions for F# apps

  •    FSharp

Elmish implements core abstractions that can be used to build applications following the “model view update” style of architecture, as made famous by Elm. The library however does not model any "view" and is intended for use in conjuction with a DOM/renderer, like React/ReactNative or VirtualDOM. Those familiar with Redux may find Elmish a more natural fit when targeting React or ReactNative as it allows one to stay completely in idiomatic F#.

montage - Montage is an elegant, open source HTML5 framework maintained by Montage Studio that rivals native SDKs, yet is easier to learn

  •    Javascript

MontageJS is a new type of application framework powered by standard web technologies. Designed with an eye toward maintainability and performance, MontageJS simplifies the development of rich HTML5 applications by providing modular components, real-time two-way data binding, object serialization with DOM mapping, event handling, a managed component draw cycle, CommonJS dependency management, and many more conveniences to help build robust single-page web applications. MontageJS has a clean interface for creating custom user interface components. Each component can stand alone or be composed of other components. Each component is modeled as a stand-alone web application with its own HTML template, JavaScript, CSS, serialized component object model, and resources. With few exceptions, a component can stand on the web platform like any other web page. There are no fully JavaScript-driven templates in MontageJS. This separation of concerns allows designers to use the technologies they are comfortable with (without having to dig into the JavaScript) and developers to isolate and test individual components using familiar techniques.

purescript-pux - Build type-safe web apps with PureScript.

  •    PureScript

Build type-safe web applications with PureScript. Pux has not focused on performance yet. The slow performance arises from translating Pux's (smolder) virtual DOM to React's virtual DOM. The goal is to write a purescript virtual DOM module for smolder, which would avoid that translation step and could be optimized for a monadic datastructure. I suspect this would achieve performance on par with Halogen.


ui-router - The de-facto solution to flexible routing with nested views in AngularJS

  •    TypeScript

Angular UI-Router is a client-side Single Page Application routing framework for AngularJS.Routing frameworks for SPAs update the browser's URL as the user navigates through the app. Conversely, this allows changes to the browser's URL to drive navigation through the app, thus allowing the user to create a bookmark to a location deep within the SPA.

take-home - A take-home application server written in Elm and only Elm

  •    Elm

While this project provides a good start place for anyone wishing to use full-stack Elm, it does not provide a "do everything" framework like Rails or Django just yet. There is work to make it more like a framework with scripting, but at this time it's not there yet. Notice how there's no longer a view. The update function is responsible for updating the model, while the router is responsible for writing replies to the client.

deku - Render interfaces using pure functions and virtual DOM

  •    Javascript

Deku is a library for rendering interfaces using pure functions and virtual DOM. Instead of using classes and local state, Deku just uses functions and pushes the responsibility of all state management and side-effects onto tools like Redux. It also aims to support only modern browsers to keep things simple.

iron-list - Element for a virtual, "infinite" list

  •    Javascript

iron-list displays a virtual, 'infinite' list. The template inside the iron-list element represents the DOM to create for each list item. The items property specifies an array of list item data. For performance reasons, not every item in the list is rendered at once; instead a small subset of actual template elements (enough to fill the viewport) are rendered and reused as the user scrolls. As such, it is important that all state of the list template be bound to the model driving it, since the view may be reused with a new model at any time. Particularly, any state that may change as the result of a user interaction with the list item must be bound to the model to avoid view state inconsistency.

morphdom - Fast and lightweight DOM diffing/patching (no virtual DOM needed)

  •    Javascript

This module was created to solve the problem of updating the DOM in response to a UI component or page being rerendered. One way to update the DOM is to simply toss away the existing DOM tree and replace it with a new DOM tree (e.g., myContainer.innerHTML = newHTML). While replacing an existing DOM tree with an entirely new DOM tree will actually be very fast, it comes with a cost. The cost is that all of the internal state associated with the existing DOM nodes (scroll positions, input caret positions, CSS transition states, etc.) will be lost. Instead of replacing the existing DOM tree with a new DOM tree we want to transform the existing DOM tree to match the new DOM tree while minimizing the number of changes to the existing DOM tree. This is exactly what the morphdom module does! Give it an existing DOM node tree and a target DOM node tree and it will efficiently transform the existing DOM node tree to exactly match the target DOM node tree with the minimum amount of changes. morphdom does not rely on any virtual DOM abstractions. Because morphdom is using the real DOM, the DOM that the web browser is maintaining will always be the source of truth. Even if you have code that manually manipulates the DOM things will still work as expected. In addition, morphdom can be used with any templating language that produces an HTML string.

React - JavaScript library for building user interfaces

  •    Javascript

React is a JavaScript library for building user interfaces. Lots of people use React as the V in MVC. React makes it painless to create interactive UIs. Design simple views for each state in your application, and React will efficiently update and render just the right components when your data changes. React can also render on the server using Node and power mobile apps using React Native.

miso - :ramen: A tasty Haskell front-end framework

  •    Haskell

Miso is a small "isomorphic" Haskell front-end framework for quickly building highly interactive single-page web applications. It features a virtual-dom, diffing / patching algorithm, attribute and property normalization, event delegation, event batching, SVG, Server-sent events, Websockets, type-safe servant-style routing and an extensible Subscription-based subsystem. Inspired by Elm, Redux and Bobril. Miso is pure by default, but side effects (like XHR) can be introduced into the system via the Effect data type. Miso makes heavy use of the GHCJS FFI and therefore has minimal dependencies. Miso can be considered a shallow embedded domain-specific language for modern web programming. To get started quickly building applications, we recommend using the stack or nix package managers. Obtaining GHCJS is required as a prerequisite. stack and nix make this process easy, if you're using cabal we assume you have obtained GHCJS by other means.

Spots - :bamboo: Spots is a cross-platform view controller framework for building component-based UIs

  •    Swift

Spots is a cross-platform view controller framework for building component-based UIs. The internal architecture is built using generic view models that can be transformed both to and from JSON. So, moving your UI declaration to a backend is as easy as pie. Data source and delegate setup is handled by Spots, so there is no need for you to do that manually. The public API is jam-packed with convenience methods for performing mutation, it is as easy as working with a regular collection type. If you are looking for a way to get started with Spots, we recommend taking a look at our Getting started guide.

Spots - :bamboo: Spots is a cross-platform view controller framework for building component-based UIs

  •    Swift

Spots is a cross-platform view controller framework for building component-based UIs. The internal architecture is built using generic view models that can be transformed both to and from JSON. So, moving your UI declaration to a backend is as easy as pie. Data source and delegate setup is handled by Spots, so there is no need for you to do that manually. The public API is jam-packed with convenience methods for performing mutation, it is as easy as working with a regular collection type. If you are looking for a way to get started with Spots, we recommend taking a look at our Getting started guide.

Backbone.js - Model, View for Javascript

  •    Javascript

Backbone.js gives structure to web applications by providing models with key-value binding and custom events, collections with a rich API of enumerable functions, views with declarative event handling, and connects it all to your existing API over a RESTful JSON interface.

Apache Beehive - Simple object model on J2EE and Struts

  •    Java

Beehive makes J2EE programming easier by building a simple object model on J2EE and Struts

etch - Builds components using a simple and explicit API around virtual-dom

  •    Javascript

Etch is a library for writing HTML-based user interface components that provides the convenience of a virtual DOM, while at the same time striving to be minimal, interoperable, and explicit. Etch can be used anywhere, but it was specifically designed with Atom packages and Electron applications in mind.Note that using an Etch component does not require a reference to the Etch library. Etch is an implementation detail, and from the outside the component is just an ordinary object with a simple interface and an .element property. You can also take a more declarative approach by embedding Etch components directly within other Etch components, which we'll cover later in this document.

virtual-dom - A Virtual DOM and diffing algorithm

  •    Javascript

Manual DOM manipulation is messy and keeping track of the previous DOM state is hard. A solution to this problem is to write your code as if you were recreating the entire DOM whenever state changes. Of course, if you actually recreated the entire DOM every time your application state changed, your app would be very slow and your input fields would lose focus. virtual-dom is a collection of modules designed to provide a declarative way of representing the DOM for your app. So instead of updating the DOM when your application state changes, you simply create a virtual tree or VTree, which looks like the DOM state that you want. virtual-dom will then figure out how to make the DOM look like this efficiently without recreating all of the DOM nodes.

angular - UI-Router for Angular: State-based routing for Angular (v2+)

  •    TypeScript

@uirouter/angular is a client-side Single Page Application routing framework for Angular. Routing frameworks for SPAs update the browser's URL as the user navigates through the app. Conversely, this allows changes to the browser's URL to drive navigation through the app, thus allowing the user to create a bookmark to a location deep within the SPA.