<html xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:w="urn:schemas-microsoft-com:office:word" xmlns:m="http://schemas.microsoft.com/office/2004/12/omml" xmlns="http://www.w3.org/TR/REC-html40">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=us-ascii">
<meta name="Generator" content="Microsoft Word 15 (filtered medium)">
<style><!--
/* Font Definitions */
@font-face
{font-family:SimSun;
panose-1:2 1 6 0 3 1 1 1 1 1;}
@font-face
{font-family:"Cambria Math";
panose-1:2 4 5 3 5 4 6 3 2 4;}
@font-face
{font-family:Calibri;
panose-1:2 15 5 2 2 2 4 3 2 4;}
@font-face
{font-family:"\@SimSun";
panose-1:2 1 6 0 3 1 1 1 1 1;}
@font-face
{font-family:"Bodoni MT Poster Compressed";
panose-1:2 7 7 6 8 6 1 5 2 4;}
/* Style Definitions */
p.MsoNormal, li.MsoNormal, div.MsoNormal
{margin:0in;
margin-bottom:.0001pt;
font-size:11.0pt;
font-family:"Calibri",sans-serif;}
a:link, span.MsoHyperlink
{mso-style-priority:99;
color:#0563C1;
text-decoration:underline;}
a:visited, span.MsoHyperlinkFollowed
{mso-style-priority:99;
color:#954F72;
text-decoration:underline;}
pre
{mso-style-priority:99;
mso-style-link:"HTML Preformatted Char";
margin:0in;
margin-bottom:.0001pt;
font-size:10.0pt;
font-family:"Courier New";}
p.MsoListParagraph, li.MsoListParagraph, div.MsoListParagraph
{mso-style-priority:34;
margin-top:0in;
margin-right:0in;
margin-bottom:0in;
margin-left:.5in;
margin-bottom:.0001pt;
font-size:11.0pt;
font-family:"Calibri",sans-serif;}
span.EmailStyle17
{mso-style-type:personal-compose;
font-family:"Calibri",sans-serif;
color:windowtext;}
span.HTMLPreformattedChar
{mso-style-name:"HTML Preformatted Char";
mso-style-priority:99;
mso-style-link:"HTML Preformatted";
font-family:"Courier New";}
.MsoChpDefault
{mso-style-type:export-only;}
@page WordSection1
{size:8.5in 11.0in;
margin:1.0in 1.0in 1.0in 1.0in;}
div.WordSection1
{page:WordSection1;}
/* List Definitions */
@list l0
{mso-list-id:1574271064;
mso-list-type:hybrid;
mso-list-template-ids:-1781865520 67698703 67698713 67698715 67698703 67698713 67698715 67698703 67698713 67698715;}
@list l0:level1
{mso-level-tab-stop:none;
mso-level-number-position:left;
text-indent:-.25in;}
@list l0:level2
{mso-level-number-format:alpha-lower;
mso-level-tab-stop:none;
mso-level-number-position:left;
text-indent:-.25in;}
@list l0:level3
{mso-level-number-format:roman-lower;
mso-level-tab-stop:none;
mso-level-number-position:right;
text-indent:-9.0pt;}
@list l0:level4
{mso-level-tab-stop:none;
mso-level-number-position:left;
text-indent:-.25in;}
@list l0:level5
{mso-level-number-format:alpha-lower;
mso-level-tab-stop:none;
mso-level-number-position:left;
text-indent:-.25in;}
@list l0:level6
{mso-level-number-format:roman-lower;
mso-level-tab-stop:none;
mso-level-number-position:right;
text-indent:-9.0pt;}
@list l0:level7
{mso-level-tab-stop:none;
mso-level-number-position:left;
text-indent:-.25in;}
@list l0:level8
{mso-level-number-format:alpha-lower;
mso-level-tab-stop:none;
mso-level-number-position:left;
text-indent:-.25in;}
@list l0:level9
{mso-level-number-format:roman-lower;
mso-level-tab-stop:none;
mso-level-number-position:right;
text-indent:-9.0pt;}
ol
{margin-bottom:0in;}
ul
{margin-bottom:0in;}
--></style><!--[if gte mso 9]><xml>
<o:shapedefaults v:ext="edit" spidmax="1026" />
</xml><![endif]--><!--[if gte mso 9]><xml>
<o:shapelayout v:ext="edit">
<o:idmap v:ext="edit" data="1" />
</o:shapelayout></xml><![endif]-->
</head>
<body lang="EN-US" link="#0563C1" vlink="#954F72">
<div class="WordSection1">
<p class="MsoNormal">Yes, it’s time to do it.<o:p></o:p></p>
<p class="MsoNormal">I suggest to use Vue, there are several reasons:<o:p></o:p></p>
<p class="MsoListParagraph" style="text-indent:-.25in;mso-list:l0 level1 lfo1"><![if !supportLists]><span style="mso-list:Ignore">1.<span style="font:7.0pt "Times New Roman"">
</span></span><![endif]>MIT license <a href="https://github.com/vuejs/vue/blob/dev/LICENSE">
https://github.com/vuejs/vue/blob/dev/LICENSE</a><o:p></o:p></p>
<p class="MsoListParagraph" style="text-indent:-.25in;mso-list:l0 level1 lfo1"><![if !supportLists]><span style="mso-list:Ignore">2.<span style="font:7.0pt "Times New Roman"">
</span></span><![endif]>The sizes of the libraries: <b>Vue is about 80KB, much smaller than Angular (500+KB), React(100KB)</b><o:p></o:p></p>
<p class="MsoListParagraph">It is sensitive on space for our OpenBMC embedded system. So Vue is the best candidate.<o:p></o:p></p>
<p class="MsoListParagraph" style="text-indent:-.25in;mso-list:l0 level1 lfo1"><![if !supportLists]><span style="mso-list:Ignore">3.<span style="font:7.0pt "Times New Roman"">
</span></span><![endif]>It is already used by big internet company like Gitlab/Alibaba.<o:p></o:p></p>
<p class="MsoListParagraph" style="text-indent:-.25in;mso-list:l0 level1 lfo1"><![if !supportLists]><span style="mso-list:Ignore">4.<span style="font:7.0pt "Times New Roman"">
</span></span><![endif]>Vue is the most popular frameworks, according to the number of stars on GitHub projects for Angular, React, and Vue.<o:p></o:p></p>
<p class="MsoNormal" style="margin-left:1.0in;text-indent:.5in">Angular React
<span style="background:yellow;mso-highlight:yellow">Vue</span><o:p></o:p></p>
<p class="MsoListParagraph"># Watchers 3.3k 3.7k
<span style="background:yellow;mso-highlight:yellow">5.7k</span><o:p></o:p></p>
<p class="MsoListParagraph"># Stars 43k 71k
<span style="background:yellow;mso-highlight:yellow">122k</span><o:p></o:p></p>
<p class="MsoListParagraph"># Forks 11k 16k
<span style="background:yellow;mso-highlight:yellow">17k</span><o:p></o:p></p>
<p class="MsoListParagraph" style="text-indent:-.25in;mso-list:l0 level1 lfo1"><![if !supportLists]><span style="mso-list:Ignore">5.<span style="font:7.0pt "Times New Roman"">
</span></span><![endif]>Vue is two-way binding<o:p></o:p></p>
<p class="MsoListParagraph" style="text-indent:-.25in;mso-list:l0 level1 lfo1"><![if !supportLists]><span style="mso-list:Ignore">6.<span style="font:7.0pt "Times New Roman"">
</span></span><![endif]>Vue is based on JS+HTML, it’s easy for existing AngularJS developer to transfer, but not like Angular (TS) and React (JSX)<o:p></o:p></p>
<p class="MsoNormal"><o:p> </o:p></p>
<p class="MsoNormal">Thanks,<o:p></o:p></p>
<p class="MsoNormal">Kwin.<o:p></o:p></p>
<p class="MsoNormal"><o:p> </o:p></p>
<pre><span style="color:black">On 9/6/19 9:51 AM, Derick Montague wrote:<o:p></o:p></span></pre>
<pre><span style="color:black">><i> Hello,<o:p></o:p></i></span></pre>
<pre><span style="color:black">><i> We would like to start the discussion of migrating the BMC GUI off of <o:p></o:p></i></span></pre>
<pre><span style="color:black">><i> AngularJS. The AngularJS long term support period is 3 years and <o:p></o:p></i></span></pre>
<pre><span style="color:black">><i> started on 7/1/2018 and will end on 7/30/2021. You can read more about <o:p></o:p></i></span></pre>
<pre><span style="color:black">><i> this on the angular blog - <o:p></o:p></i></span></pre>
<pre><span style="color:black">><i> <a href="https://blog.angular.io/stable-angularjs-and-long-term-support-7e077635ee9c.">https://blog.angular.io/stable-angularjs-and-long-term-support-7e077635ee9c.</a><o:p></o:p></i></span></pre>
<pre><span style="color:black">><i> The most likely options for migration are Angular, React, and Vue. <o:p></o:p></i></span></pre>
<pre><span style="color:black">><i> LogRocket has a decent comparison of the 3 frameworks - <o:p></o:p></i></span></pre>
<pre><span style="color:black">><i> <a href="https://blog.logrocket.com/angular-vs-react-vs-vue-a-performance-comparison/">https://blog.logrocket.com/angular-vs-react-vs-vue-a-performance-comparison/.</a><o:p></o:p></i></span></pre>
<pre><span style="color:black">><i> There is also a really interesting framework called Svelte for <o:p></o:p></i></span></pre>
<pre><span style="color:black">><i> building reactive apps that might be worth considering as well - <o:p></o:p></i></span></pre>
<pre><span style="color:black">><i> <a href="https://github.com/sveltejs/svelte">https://github.com/sveltejs/svelte</a><o:p></o:p></i></span></pre>
<pre><span style="color:black">><i> My first thought based on the size of the application, the need for a <o:p></o:p></i></span></pre>
<pre><span style="color:black">><i> smaller footprint, and the benefit of a small learning curve would <o:p></o:p></i></span></pre>
<pre><span style="color:black">><i> be Vue. However, I'm just throwing that out there to start the <o:p></o:p></i></span></pre>
<pre><span style="color:black">><i> conversation.<o:p></o:p></i></span></pre>
<pre><span style="color:black"><o:p> </o:p></span></pre>
<pre><span style="color:black">Derick, thanks for looking into this. I agree a small footprint and <o:p></o:p></span></pre>
<pre><span style="color:black">short learning curve are important criteria. Some other criteria to <o:p></o:p></span></pre>
<pre><span style="color:black">consider:<o:p></o:p></span></pre>
<pre><span style="color:black">- Licensing terms, looking for permissive licenses like Apache 2.0 or MIT.<o:p></o:p></span></pre>
<pre><span style="color:black">- Community support, especially for security fixes.<o:p></o:p></span></pre>
<pre><span style="color:black"><o:p> </o:p></span></pre>
<pre><span style="color:black">- Joseph<o:p></o:p></span></pre>
<pre><span style="color:black"><o:p> </o:p></span></pre>
<pre><span style="color:black">><i> Does anyone else have a preference on the next front end framework?<o:p></o:p></i></span></pre>
<pre><span style="color:black">><o:p> </o:p></span></pre>
<p class="MsoNormal"><o:p> </o:p></p>
<p class="MsoNormal"><o:p> </o:p></p>
<p class="MsoNormal"><i><span style="font-size:24.0pt;font-family:"Bodoni MT Poster Compressed",serif;color:#00B0F0">Thanks,<o:p></o:p></span></i></p>
<p class="MsoNormal"><i><span style="font-size:24.0pt;font-family:"Bodoni MT Poster Compressed",serif;color:#00B0F0">Kwin.<o:p></o:p></span></i></p>
<p class="MsoNormal"><o:p> </o:p></p>
</div>
</body>
</html>