From 9b50235dd6fc1f93ad22f9e2af0cafdce264e13a Mon Sep 17 00:00:00 2001 From: Peter Gyory Date: Wed, 23 Sep 2015 16:41:26 -0400 Subject: [PATCH 1/5] Update README gzip size statement --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index 7bb8aee5..6f19f097 100644 --- a/README.md +++ b/README.md @@ -19,7 +19,7 @@ Mithril is a client-side MVC framework - a tool to organize code in a way that i ### Light-weight -- Only 5kb gzipped, no dependencies +- Only 7kb gzipped, no dependencies - Small API, small learning curve ### Robust From 80f43c260b710a09bdec875b0e596293c3727801 Mon Sep 17 00:00:00 2001 From: Leo Horie Date: Mon, 28 Sep 2015 22:26:41 -0400 Subject: [PATCH 2/5] fix file size in docs --- docs/comparison.md | 2 +- docs/getting-started.md | 2 +- docs/layout/index.html | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) diff --git a/docs/comparison.md b/docs/comparison.md index 268c7cb7..fb24bcdd 100644 --- a/docs/comparison.md +++ b/docs/comparison.md @@ -6,7 +6,7 @@ This page aims to provide a comparison between Mithril and some of the most wide ### Code Size -One of the most obvious differences between Mithril and most frameworks is in file size: Mithril is around 8kb gzipped and has no dependencies on other libraries. +One of the most obvious differences between Mithril and most frameworks is in file size: Mithril is around 7kb gzipped and has no dependencies on other libraries. Note that while a small gzipped size can look appealing, that number is often used to "hide the weight" of the uncompressed code: remember that the decompressed Javascript still needs to be parsed and evaluated on every page load, and this cost (which can be in the dozens of milliseconds range for some frameworks in some browsers) cannot be cached. diff --git a/docs/getting-started.md b/docs/getting-started.md index b2710ad5..7ee6f431 100644 --- a/docs/getting-started.md +++ b/docs/getting-started.md @@ -4,7 +4,7 @@ Mithril is a client-side Javascript MVC framework, i.e. it's a tool to make application code divided into a data layer (called **M**odel), a UI layer (called **V**iew), and a glue layer (called **C**ontroller) -Mithril is around 8kb gzipped thanks to its [small, focused, API](mithril.md). It provides a templating engine with a virtual DOM diff implementation for performant rendering, utilities for high-level modelling via functional composition, as well as support for routing and componentization. +Mithril is around 7kb gzipped thanks to its [small, focused, API](mithril.md). It provides a templating engine with a virtual DOM diff implementation for performant rendering, utilities for high-level modelling via functional composition, as well as support for routing and componentization. The goal of the framework is to make application code discoverable, readable and maintainable, and hopefully help you become an even better developer. diff --git a/docs/layout/index.html b/docs/layout/index.html index b85f236d..7b34ad28 100644 --- a/docs/layout/index.html +++ b/docs/layout/index.html @@ -50,7 +50,7 @@

Light-weight

    -
  • Only 8kb gzipped, no dependencies
    • +
  • Only 7kb gzipped, no dependencies
  • Small API, small learning curve
From 1cdb66b20d0fa111cece9dd1335784584a3bc62d Mon Sep 17 00:00:00 2001 From: Matt Tracy Date: Tue, 29 Sep 2015 17:31:23 -0400 Subject: [PATCH 3/5] Typescript: Support for Parameterized Components Previously, the Typescript definition file did not support parameterized components. The `component()` function did accept additional arguments, but the `MithrilComponent` interface did not allow components to have any additional arguments in either their `controller()` or `view()` methods. Properly supporting flexible variadic parameters in typescript is somewhat challenging. Tuple types are close, but would only work if the signature of `controller` and `view` accepted arrays of arguments: ``` interface MithrilStatic { component( component: ParameterizedMithrilComponent, ...args:TRest ) : TController } interface ParameterizedMithrilComponent { // Doesn't match mithril's component interface; we want to unpack the contents // of TRest controller: (args: TRest) => TController, view: (ctrl: TController, args: TRest) } ``` Therefore, I have gone with a more traditional method of defining several overloads of m.component(), each with a different number of extra parameters. Because of this, the first four parameters to m.component() will be correctly type checked (i.e. if the Component's controller defines the parameter, it must be supplied to m.component). Additional parameters beyond the first four are allowed, but are caught via an `...args:any[]` and thus are not type checked. --- mithril.d.ts | 267 +++++++++++++++++++++++++++++++++++++++++++++------ 1 file changed, 238 insertions(+), 29 deletions(-) diff --git a/mithril.d.ts b/mithril.d.ts index d89dde59..a5c24a6e 100644 --- a/mithril.d.ts +++ b/mithril.d.ts @@ -28,22 +28,6 @@ declare module _mithril { MithrilComponent> ): MithrilVirtualElement; - /** - * Initializes a component for use with m.render, m.mount, etc. - * - * @param component A component. - * @param args Arguments to optionally pass to the component. - * @return A component. - * - * @see m.render - * @see m.mount - * @see m - */ - ( - component: MithrilComponent, - ...args: any[] - ): MithrilComponent; - /** * Creates a virtual element for use with m.render, m.mount, etc. * @@ -67,18 +51,121 @@ declare module _mithril { * Initializes a component for use with m.render, m.mount, etc. * Shorthand for m.component. * - * @param selector A component. - * @param args Arguments to optionally pass to the component. - * @return A component. + * @param component A mithril component. + * @return A mithril component. * * @see m.render * @see m.mount * @see m.component */ - ( - component: MithrilComponent, - ...args: any[] - ): MithrilComponent; + ( + component: MithrilComponent + ): MithrilComponent; + + /** + * Initializes a component for use with m.render, m.mount, etc. + * Shorthand for m.component. + * + * @param component A parameterized component. + * @param arg1 First argument to bind to the component. + * @return A component bound with the supplied arguments. + * + * @see m.render + * @see m.mount + * @see m.component + */ + ( + component: ParameterizedMithrilComponent, + arg1: T1 + ): MithrilComponent; + + /** + * Initializes a component for use with m.render, m.mount, etc. + * Shorthand for m.component. + * + * @param component A parameterized component. + * @param arg1 First argument to bind to the component. + * @param arg2 Second argument to bind to the component. + * @return A component bound with the supplied arguments. + * + * @see m.render + * @see m.mount + * @see m.component + */ + ( + component: ParameterizedMithrilComponent, + arg1: T1, + arg2: T2 + ): MithrilComponent; + + /** + * Initializes a component for use with m.render, m.mount, etc. + * Shorthand for m.component. + * + * @param component A parameterized component. + * @param arg1 First argument to bind to the component. + * @param arg2 Second argument to bind to the component. + * @param arg3 Third argument to bind to the component. + * @return A component bound with the supplied arguments. + * + * @see m.render + * @see m.mount + * @see m.component + */ + ( + component: ParameterizedMithrilComponent, + arg1: T1, + arg2: T2, + arg3: T3 + ): MithrilComponent; + + /** + * Initializes a parameterized component for use with m.render, m.mount, etc. + * Shorthand for m.component. + * + * @param component A parameterized component. + * @param arg1 First argument to bind to the component. + * @param arg2 Second argument to bind to the component. + * @param arg3 Third argument to bind to the component. + * @param arg4 Fourth argument to bind to the component. + * @return A component bound with the supplied arguments. + * + * @see m.render + * @see m.mount + * @see m.component + */ + ( + component: ParameterizedMithrilComponent, + arg1: T1, + arg2: T2, + arg3: T3, + arg4: T4 + ): MithrilComponent; + + /** + * Initializes a parameterized component for use with m.render, m.mount, etc. + * Shorthand for m.component. + * + * @param component A parameterized component. + * @param arg1 First argument to bind to the component. + * @param arg2 Second argument to bind to the component. + * @param arg3 Third argument to bind to the component. + * @param arg4 Fourth argument to bind to the component. + * @param args Additional optional arguments which are not type checked. + * @return A component bound with the supplied arguments. + * + * @see m.render + * @see m.mount + * @see m.component + */ + ( + component: ParameterizedMithrilComponent, + arg1: T1, + arg2: T2, + arg3: T3, + arg4: T4, + ...args:any[] + ): MithrilComponent; /** * Creates a getter-setter function that wraps a Mithril promise. Useful @@ -149,18 +236,116 @@ declare module _mithril { /** * Initializes a component for use with m.render, m.mount, etc. * - * @param selector A component. - * @param args Arguments to optionally pass to the component. - * @return A component. + * @param component A mithril component. + * @return A mithril component. * * @see m.render * @see m.mount * @see m */ - component( - component: MithrilComponent, + component( + component: MithrilComponent + ): MithrilComponent; + + /** + * Initializes a parameterized component for use with m.render, m.mount, etc. + * + * @param component A parameterized component. + * @param arg1 First argument to bind to the component. + * @return A component bound with the supplied arguments. + * + * @see m.render + * @see m.mount + * @see m + */ + component( + component: ParameterizedMithrilComponent, + arg1: T1 + ): MithrilComponent; + + /** + * Initializes a parameterized component for use with m.render, m.mount, etc. + * + * @param component A parameterized component. + * @param arg1 First argument to bind to the component. + * @param arg2 Second argument to bind to the component. + * @return A component bound with the supplied arguments. + * + * @see m.render + * @see m.mount + * @see m + */ + component( + component: ParameterizedMithrilComponent, + arg1: T1, + arg2: T2 + ): MithrilComponent; + + /** + * Initializes a parameterized component for use with m.render, m.mount, etc. + * + * @param component A parameterized component. + * @param arg1 First argument to bind to the component. + * @param arg2 Second argument to bind to the component. + * @param arg3 Third argument to bind to the component. + * @return A component bound with the supplied arguments. + * + * @see m.render + * @see m.mount + * @see m + */ + component( + component: ParameterizedMithrilComponent, + arg1: T1, + arg2: T2, + arg3: T3 + ): MithrilComponent; + + /** + * Initializes a parameterized component for use with m.render, m.mount, etc. + * + * @param component A parameterized component. + * @param arg1 First argument to bind to the component. + * @param arg2 Second argument to bind to the component. + * @param arg3 Third argument to bind to the component. + * @param arg4 Fourth argument to bind to the component. + * @return A component bound with the supplied arguments. + * + * @see m.render + * @see m.mount + * @see m + */ + component( + component: ParameterizedMithrilComponent, + arg1: T1, + arg2: T2, + arg3: T3, + arg4: T4 + ): MithrilComponent; + + /** + * Initializes a parameterized component for use with m.render, m.mount, etc. + * + * @param component A parameterized component. + * @param arg1 First argument to bind to the component. + * @param arg2 Second argument to bind to the component. + * @param arg3 Third argument to bind to the component. + * @param arg4 Fourth argument to bind to the component. + * @param args Additional optional arguments which are not type checked. + * @return A component bound with the supplied arguments. + * + * @see m.render + * @see m.mount + * @see m + */ + component( + component: ParameterizedMithrilComponent, + arg1: T1, + arg2: T2, + arg3: T3, + arg4: T4, ...args: any[] - ): MithrilComponent; + ): MithrilComponent; /** * Trust this string of HTML. @@ -599,6 +784,30 @@ declare module _mithril { view(ctrl: T): MithrilVirtualElement; } + /** + * This represents a parameterized MithrilComponent with up to six parameters, + * intended to be instantiated via m.component(). + * + * @see m + * @see m.component + */ + interface ParameterizedMithrilComponent { + /** + * The component's controller. + * + * @see m.component + */ + controller: (arg1: T1, arg2: T2, arg3: T3, arg4: T4, ...args: any[]) => TController; + + + /** + * creates a view out of virtual elements. + * + * @see m.component + */ + view(ctrl: TController, arg1: T1, arg2: T2, arg3: T3, arg4: T4, ...args:any[]): MithrilVirtualElement; + } + /** * This is the base interface for property getter-setters * From b542bdad3a8198f512942fb4fac93cbf02921135 Mon Sep 17 00:00:00 2001 From: Casey Webb Date: Sat, 10 Oct 2015 11:04:22 -0400 Subject: [PATCH 4/5] Use modern TravisCI platform @see http://docs.travis-ci.com/user/migrating-from-legacy/?utm_source=legacy-notice&utm_medium=banner&utm_campaign=legacy-upgrade --- .travis.yml | 2 ++ 1 file changed, 2 insertions(+) diff --git a/.travis.yml b/.travis.yml index 71e35b08..f83e4f4b 100644 --- a/.travis.yml +++ b/.travis.yml @@ -5,3 +5,5 @@ node_js: script: - grunt test - grunt teste2e + +sudo: false From 7278e0ded5a7af1b6d8e9e53422ca265fa5d4cca Mon Sep 17 00:00:00 2001 From: philtay Date: Sun, 18 Oct 2015 01:24:33 +0200 Subject: [PATCH 5/5] Test against Node.js 0.12 and 4.1 --- .travis.yml | 2 ++ 1 file changed, 2 insertions(+) diff --git a/.travis.yml b/.travis.yml index f83e4f4b..62c2fed2 100644 --- a/.travis.yml +++ b/.travis.yml @@ -1,6 +1,8 @@ language: node_js node_js: - "0.10" + - "0.12" + - "4.1" script: - grunt test