Professional Documents
Culture Documents
ieski / owl
forked from odoo/owl
odoo.github.io/owl/
View license
0
stars
136
forks
Star
Notifications
master
Go to file
Contribute
Fetch upstream
View code
🦉 OWL Framework 🦉
Class based components with hooks, reactive state and concurrent mode
Project Overview
The Odoo Web Library (OWL) is a smallish (~<20kb gzipped) UI framework intended to
be
the basis for the Odoo Web Client. Owl is a modern
framework, written in Typescript, taking
the best ideas from React and Vue in a
simple and consistent way. Owl's main features are:
https://github.com/ieski/owl 1/4
18/06/2021 GitHub - ieski/owl: OWL: A web framework for structured, dynamic and maintainable applications
Owl components are defined with ES6 classes, they use QWeb templates, an
underlying
virtual DOM, integrates beautifully with hooks, and the rendering is
asynchronous.
Why Owl?
Why did Odoo decide to make Yet Another Framework? This is really a question
that
deserves a long answer. But in short, we believe that
while the current state of the art
frameworks are excellent, they are not
optimized for our use case, and there is still room for
something else.
Example
Here is a short example to illustrate interactive components:
<button t-on-click="state.value++">
</button>`;
<div>
README.md
<span>Hello Owl</span>
<Counter />
</div>`;
https://github.com/ieski/owl 2/4
18/06/2021 GitHub - ieski/owl: OWL: A web framework for structured, dynamic and maintainable applications
Note that the counter component is made reactive with the useState hook.
Also, all
examples here uses the xml helper to define inline templates.
But this is not mandatory,
many applications will load templates separately.
Design Principles
OWL is designed to be used in highly dynamic applications where changing
requirements
are common and code needs to be maintained by large teams.
XML based: templates are based on the XML format, which allows interesting
applications. For example, they could be stored in a database and modified
dynamically
with xpaths .
templates compilation in the browser: this may not be a good fit for all
applications,
but if you need to generate dynamically user interfaces in the
browser, this is very
powerful. For example, a generic form view component
could generate a specific form
user interface for each various models, from a XML view.
no toolchain required: this is extremely useful for some applications, if,
for various
reasons (security/deployment/dynamic modules/specific assets tools),
it is not ok to use
standard web tools based on npm .
Owl is not designed to be fast nor small (even though it is quite good on those
two topics).
It is a no nonsense framework to build applications. There is only
one way to define
components (with classes). There is no black magic. It just
works.
Documentation
A complete documentation for Owl can be found here:
Installing Owl
Owl is available on npm and can be installed with the following command:
https://github.com/ieski/owl 3/4
18/06/2021 GitHub - ieski/owl: OWL: A web framework for structured, dynamic and maintainable applications
If you want to use a simple <script> tag, the last release can be downloaded here:
owl-1.2.0
License
OWL is LGPL licensed.
Releases
49
tags
Packages
No packages published
Languages
JavaScript 80.8%
TypeScript 18.9%
Other 0.3%
https://github.com/ieski/owl 4/4