|
1 | 1 | # VisualDL Web app Develop
|
2 | 2 |
|
3 |
| -VisualDL has two three components. |
| 3 | +VisualDL has three components. |
4 | 4 | 1. The Python/C++ SDK that logs the data during training.
|
5 | 5 | 1. The single page client side app that visualized training data.
|
6 | 6 | 1. The server (powered on Flask) that reads the logs data and delivers it to the client side app for displaying graphs (scalars/histograms) and embeddings.
|
7 | 7 |
|
8 |
| -The server provided the needed data and pass to the client side to draw scalars or histograms. The users can visualize the training progress and make a better network architecture evaluation. |
9 |
| - |
10 | 8 | This article will go over the basic web-app architecture and development guide.
|
11 | 9 |
|
12 | 10 | ## TL;DR
|
13 |
| -If you are not interested in the details of mobo jumbo and want to start development as soon as possible, |
14 |
| -please run the following commands. |
| 11 | +If you are not interested in the details of mumbo jumbo and want to start development as soon as possible, please run the following commands. |
15 | 12 |
|
16 | 13 | To clone the repo and to prepare the environment
|
17 | 14 | ```bash
|
@@ -40,7 +37,7 @@ The VisualDL Web app uses multiple frameworks to help manage the project. They a
|
40 | 37 | ## Webpack
|
41 | 38 | webpack is a module bundler. Its main purpose is to bundle JavaScript files for usage in a browser.
|
42 | 39 |
|
43 |
| -webpack is like a gospel to the web developers. For a long time, web developers need to worry about backward compatibility or how to support different versions of browsers. |
| 40 | +For a long time, web developers need to worry about backward compatibility or how to support different versions of browsers. |
44 | 41 | webpack can help to transpile the Javascript files to the version where a browser can take. The developers don't need to implement version specific code anymore.
|
45 | 42 | It can also help to minify and uglify Javascript files. In a nutshell, webpack helps to manage all of your assets (.js, .css, .gif, .sass, etc) so you don't have to.
|
46 | 43 |
|
@@ -70,15 +67,12 @@ This command will go through `package.json` and install the dependencies in the
|
70 | 67 |
|
71 | 68 | San is a JavaScript component framework that helps the developer to implement web component in MVVM architecture pattern.
|
72 | 69 |
|
73 |
| -San allows you to define a self-content view model in a .san file and attach view model objects to DOM objects. |
74 |
| -By doing so, the view layer is much cleaner and easier to implement. |
75 |
| -View layer only needs to specify the layout of the page. |
| 70 | +San allows you to define a self-contained view model in a .san file and attach view model objects to DOM objects. |
76 | 71 |
|
77 | 72 | To learn more about [san](https://github.com/ecomfe/san)
|
78 | 73 |
|
79 | 74 | ## ECharts
|
80 | 75 |
|
81 |
| -To draw the graphs we use ECharts's framework. It can pilot charts and graphs with just a few lines of code. |
82 |
| -You can create a custom graph according to your needs. VisualDL's histogram is an example of a custom chart. |
| 76 | +We use ECharts javascript library to render our charts and graphs. ECharts is a leading open source charting library that supports numerous data visualization. |
83 | 77 |
|
84 | 78 | To learn more about ECharts framework, please visit [ECharts](https://ecomfe.github.io/echarts-doc/public/en/index.html).
|
0 commit comments