Uploaded image for project: 'PUBLIC - Liferay Portal Community Edition'
  1. PUBLIC - Liferay Portal Community Edition
  2. LPS-127085

Enhance Theme Architecture to expand loading performance (external modules)

    Details

      Description

      Currently, Liferay themes are integrated in DXP via 2 main entry points:

      • clay.css
      • main.css

      This makes improving load performance very challenging since the only option is to trim down on those entry points but the system provides no further alternatives to load styles.

      The goal of this epic is to provide a flexible alternative so themes can be optimized for optimal delivery.

      More specifically, we'll focus in reducing our css footprint so that we can make page delivery faster. Our baseline scenario is the guest user who just consumes content in a simple content page with some ootb fragments in it.

      Initial assumptions we're making are that BS + atlas styles will be serve. This allows us to focus on how much styling we can strip down in the above scenario by looking to components.

       

      Test Scenarios:

      Requirement Test Case Covered by frontend/backend unit test? (Yes/No) Test Priority (business impact) Pass/Fail
      LPS-127085 Given Console terminal at liferay portal root
      When Run command: find | grep "frontend-css-web"
      Then Returns no lines
      no 5-critical  
        Given Portal startup
      When Open browser's Developer tools > Network tab and open home page
      Then Assert no request from frontend-css-web
      no 5-critical  
        Given 2 instances of portal, one is built with the changes of epic, one is without
      When Open home page of the two portal instances, do not login. Use Lighthouse extension of Chrome browser to test against the home page, and compare the difference of performance
      Then Assert the performance is increased with the changes
      no 4-major  

      Exploratory Scenarios:

      Test Case Test Priority (business impact) Chrome
      Pass/Fail
      Firefox
      Pass/Fail
      Edge
      Pass/Fail
      Safari
      Pass/Fail
      Exploratory test one or two areas that utilize these features. Focus on UI and visual regressions, which includes spacing, margins, style, colors, etc. Max Time: 45 mins
      High Priority:
      Pagination (ie: Assert Publisher Portlet with Regular Pagination Type enabled)
      Management Bar (ie: In Site Configuration > Mobile Device Families)
      NavBar (ie: Select Item modal when insert image in Web Content )
      Vertical Cards (ie: Category treeview when select category)
      Medium Priority: (if have time)
      Search bar (ie: Users and Organizations > search a user)
      Item Viewer (ie: Blogs Entry > change background image)
      Low: (if have time)
      Upload Files (ie: Documents and Media > Upload multiple files)
      Reference link to most used .scss files.
      3-medium        

        Attachments

          Issue Links

            Activity

              People

              Assignee:
              support-lep@liferay.com SE Support
              Reporter:
              jose.balsas Chema Balsas
              Recent user:
              John Co
              Participants of an Issue:
              Votes:
              0 Vote for this issue
              Watchers:
              3 Start watching this issue

                Dates

                Created:
                Updated:
                Resolved:

                  Packages

                  Version Package