JSJ 348: EnactJS with Ryan Duffy

Sponsors
- https://www.telerik.com/kendo-ui?utm_campaign=kendo-ui-awareness-jsjabber&utm_medium=social-paid&utm_source=devchattv
- http://sentry.io use the code "devchat" for $100 credit
- https://clubhouse.io/jsjabber
- https://www.cachefly.com/
PanelAimee KnightAaron FrostChris FerdinandiJoe EamesSpecial Guest: Ryan Duffy In this episode of JavaScript Jabber, the panelists talk with Ryan Duffy who works on the EnactJS framework at LG Electronics. Ryan explains the framework in depth and answers all the questions about its design and implementation from the panelists and discusses some challenges faced along the way. Check it out! Show Notes:00:28 – Advertisement - https://www.telerik.com/kendo-ui?utm_campaign=kendo-ui-awareness-jsjabber&utm_medium=social-paid&utm_source=devchattv 1:08 - Ryan introduces himself and explains a bit about the EnactJS framework. While giving some background, he says that it is the 3rd generation of web frameworks that supports apps on webOS and they started building Enact on top of React about two years ago.2:00 - Aimee asks what exactly does webOS mean. Ryan answers that webOS was created by Palm for phones and related devices and it has several instances of chromium running on device with some service layer stuff.2:36 - Aaron mentions that webOS was big when other operating systems were still coming up, and Ryan agrees saying that it didn’t get the adoption needed to make it successful later.3:00 - Ryan says that he always loved building apps for webOS phones given the flexibility and ease coming from a web development background.3:53 - Aaron asks on which other applications is webOS running other than TV. Ryan answers that TV is one of the major consumptions, and it also runs on certain robots such as the concierge ones, watches to some extent and a lot of projects internally, not yet released in the market.4:50 - Aaron asks if the Enact framework is big internally at LG. Ryan replies that it is the primary framework used for apps running on webOS.5:03 - Aaron enquires about the nature of adoption of Enact for third party or non-LG people, to which Ryan states that Enact remains the standard framework for people who are building apps.5:32 - Joe joins in the conversation.6:25 - Aaron remarks that given that webOS is used in latest robots, televisions, watches and other such apps, it sounds like they are heavily investing into it. Ryan affirms by saying that the webOS journey goes from Palm phones to HP tablets to finally coming to LG. He goes on to explain their team structure, stating that there are two major teams in play right now - the R&D team is in the US and the implementation team is in Korea.8:00 - Aaron asks about the role their team plays in the app development. Ryan replies that his team is the stack team that forms the foundation for the apps and they take decisions on what the components should look like and similar tasks. The app teams based in Korea decide their menu based on those decisions.8:35 - Aaron asks what exactly is meant by the Blink team. Ryan answers that the it’s the team that works with an LG customized version of chromium.9:10 – Aaron then asks about his individual role in the team. Ryan says that he is one of the managers of the stack team and he’s been on the team for little more than 4 years.9:30 - Aaron asks about the evolution of the framework over time. Ryan describes the historical background by saying that in the initial Enyo design the team built, was component based, and every tool needed to build single page apps had to be developed from scratch. He says that they felt the need to move on to an improved framework as they wanted to take advantage of the robust ecosystem that existed, so they ported component libraries of Enyo using the React toolset to form Enact.11:43 - Aaron asks if Enyo then ceased to exist to which Ryan states that it is still around to some extent.12:20 - Aaron asks if the team has something like “create Enact app” to create a new app internally, like React. Ryan mentions that Jason - a tooling and automation expert from their team has built a feature called V8 snapshot - which loads JavaScript into memory and takes a snapshot - can in turn be loaded by the TV to launch the app in order to achieve a faster load time. He says that their long-term goal is to increase compatibility with the ecosystem.14:40 - Aaron asks if he can use the React CLI to create something for TV as a third-party developer. Ryan elaborates that CLI can be used to build, compile and bundle apps and there is another tool- SDK to bundle it for delivery to the TV. The app is tested fully in chrome, bundled and deployed to the TV.15:25 - Aaron asks if choosing React was a natural decision for the team. Ryan explains that they researched on some component-based frameworks that were available at that time and found that React was the best choice.17:30 - Aimee asks the reason for open sourcing the framework. Ryan mentions that Enyo always has been open source. He also remarks that the team does not get a lot of input from the community and would like to get more information about what’s working and what’s not and how they can contribute back.19:40 - Aaron asks about the kind of apps can be built by using Enact except for TV. Ryan says that any kind can be built but the hesitation is that the UI library is specially designed for TV, so they may look different for other spaces like phones or other devices.20:35 – Advertisement – https://sentry.io/welcome/ – Use the code “devchat” to get two months free on Sentry’s small plan.21:30 - Aaron asks what decisions around making apps are made by Enact for the developers. Ryan explains that the architectural pattern they have chosen is higher order components, and there is a lot of attention on render props that can be easily plugged into the apps.22:48 - Aaron asks if the state part was built by the team on their own. Ryan answers in affirmative that everything in Enact is completely built by the team, no external states are used within the framework. No decisions are made in the data space yet. He mentions that they had tried to limit their Enact development effort in cases where the solution was already available unless they had a new perspective on the problem.24:30 - Aaron remarks the idea of Enact being something like a webpack is becoming clearer for him and asks Ryan if his team is spending most of their time in building component libraries. Ryan affirms by explaining that Enact is designed in layers. He goes on to explain that focus management is a difficult problem to solve where the ability to navigate an application intuitively such as in the case of remote control is handled by a certain component. Also, as LG ships TVs all over the world, there are significant internationalization requirements. He then elucidates the TV centric moonstone library in detail and states that they took all the base capabilities from it and formed a UI layer.27:26 - Aaron asks if moonstone is theme-able. Ryan says that it’s not and the UI layer in not styled.28:40 - Chris asks, as someone who manages open source projects and builds tools, about the process of making decisions on the kind of components to include and challenges Ryan and his team faced in the open source space.29:45 – Ryan says that they haven’t had the ideal open source experience yet. They do have a lot of discussions on API design and components but it’s a struggle to what to include and what to not.31:25 - Chris shares his own experience while stating that finding a common ground is always hard especially when there is internal resistance in convincing people to use new software. Ryan says that internally their biggest struggle is that a group of people use the Qt platform and there is chunk of webOS that is built on it and not on Enact. Trying to convince people to do the migration from Enyo to Enact was difficult but they have had most success in trying to eliminate friction and it was easier in the sense that there weren’t any required parameters for things.36:05 – Aaron states that all his questions are answered and his understanding of Enact is clear.36:21 – Advertisement - https://clubhouse.io/?rsCode=JSJABBER&rsEngagementMedium=UNKNOWN&rsShareMedium=UNKNOWN&utm_campaign=saasquatch&utm_medium=link&utm_source=invite 37:10 – Picks!43:41- END – Advertisement - https://www.cachefly.com/ PicksJoe
- https://www.kickstarter.com/projects/1875657065/monsters-of-feyland-for-5th-edition
Chris
- Presentation by Eric Bailey on Accessibility - https://noti.st/ericwbailey/TcMJFP/if-it-s-interactive-it-needs-a-focus-style
- https://ubtrobot.com/collections/jimu-robots
- https://www.imdb.com/title/tt0910970/
Aimee
- Coworkers at NPM
Aaron
- https://en.wikipedia.org/wiki/Pierogi
- https://en.wikipedia.org/wiki/Harry_Potter_and_the_Cursed_Child
Ryan
-

Become a supporter of this podcast: https://www.spreaker.com/podcast/javascript-jabber--6102064/support.