Skip to content

Commit 5e2376b

Browse files
authored
Update README.md
1 parent bad0717 commit 5e2376b

File tree

1 file changed

+43
-5
lines changed

1 file changed

+43
-5
lines changed

README.md

Lines changed: 43 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
# .dom [![Build Status](https://travis-ci.org/wavesoft/dot-dom.svg?branch=master)](https://travis-ci.org/wavesoft/dot-dom)
1+
# .dom [![Build Status](https://travis-ci.org/wavesoft/dot-dom.svg?branch=master)](https://travis-ci.org/wavesoft/dot-dom) [![Try it in codepen.io](https://img.shields.io/badge/Try%20it-codepen.io-blue.svg)](https://codepen.io/anon/pen/YNdNwv?editors=0010)
22

33
> A tiny (510 byte) virtual DOM template engine for embedded projects
44
@@ -10,7 +10,18 @@
1010

1111
Why? Because with such library you can create powerful GUIs in tight space environments, such as IoT devices, where saving even an extra byte actually matters!
1212

13-
[Try it in codepen.io](https://codepen.io/anon/pen/YNdNwv?editors=0010)
13+
### Features
14+
15+
* _Tiny by design_ : The library should never exceed the 512 bytes in size. The goal is not to have yet another template engine, but to have as many features as possible in 512 bytes. If a new feature is needed, an other must be sacraficed or the scope must be reduced.
16+
17+
* _Built for the future_ : The library is heavily exploiting the ES6 specifications, meaning that it's **not** supported by older borwsers. Currently it's supported by the 70% of the browsers in the market, but expect this to be 90% within the next year.
18+
19+
* _Declarative_ : Describe your HTML DOM in a structured, natural manner, helping you create powerful yet readable user interfaces.
20+
21+
* _Component-Oriented_ : Just like React.js, **.dom** promotes the use of functional components.
22+
23+
* _"Write less" accelerators_ : The library API is designed specifically to have short function names and accelerators, allowing you to describe your views with less code.
24+
1425

1526
## Installation
1627

@@ -252,7 +263,34 @@ This is the same as calling `div({className: 'className'})` and the function int
252263
253264
Are you interested in contributing to **.dom**? You are more than welcome! Just be sure to follow the guidelines:
254265
255-
1. *Always explain your code with a comment* : Since you will most probably going to do some extreme javascript corner cases in order to be able to squeeze your logic.
256-
2. *All comments should start on column 70 and wrap after column 120* : In order to perserve code-style consistency.
257-
3. *The GZipped result should __never__ be bigger than 512 bytes* : Since that's the whole purpose of the library. If you are adding a completely new feature, consider sacraficing another one, or try to reduce scope, in order to keep the balance.
266+
1. Install a local development environment (you will need node.js **6.x** or later)
267+
268+
```
269+
npm install
270+
```
258271
272+
2. **Always** run the following when you think you are ready for a pull request:
273+
274+
```
275+
npm test && npm run build && ls -l dotdom.min.js.gz
276+
```
277+
278+
3. If tests pass and the size of `dotdom.min.js.gz` is smaller than or equal to 512 bytes, create a pull request. Otherwise reduce your scope or think of another implementation in order to bring it back down to 512 bytes.
279+
280+
4. Make sure to properly comments your code, since you will most probably have to do some extreme javascript hacking. The gudeliens are the following:
281+
282+
```js
283+
/**
284+
* Functions are commented as JSDoc blocks
285+
*
286+
* @param {VNode|Array<VNode>} vnodes - The node on an array of nodes to render
287+
* ...
288+
*/
289+
global.R = render = (
290+
vnodes, // Flat-code comments start on column 70 and
291+
dom, // wrap after column 120.
292+
293+
/* Logical separations can be commented like this */
294+
295+
...
296+
```

0 commit comments

Comments
 (0)