Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

perf: category page CLS improvement #1179

Conversation

bartoszherba
Copy link
Collaborator

@bartoszherba bartoszherba commented Jun 29, 2022

Description

category page CLS improvement

Related Issue

Motivation and Context

How Has This Been Tested?

Screenshots (if appropriate):

Types of changes

  • Bug fix (non-breaking change which fixes an issue)
  • New feature (non-breaking change which adds functionality)
  • Breaking change (fix or feature that would cause existing functionality to change)

Checklist:

  • My code follows the code style of this project.
  • My change requires a change to the documentation.
  • I have updated the documentation accordingly.
  • I have read the CONTRIBUTING document.
  • I have added tests to cover my changes.
  • All new and existing tests passed.

@@ -1,10 +1,5 @@
<template>
<transition-group
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is to prevent opacity, transition issue reports

right: 0;
::v-deep .sf-product-card {
&__image-wrapper {
height: 257px;
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Because of the lack of control over SFUI components, I had to take some space to prevent content jump.

Copy link
Collaborator

@Frodigo Frodigo left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I need more time to analyze and review this. I will back to you with comments later.

@bartoszherba bartoszherba requested a review from Frodigo June 29, 2022 14:11
- improve title loading
- improve filters cls and content jumps
@bartoszherba bartoszherba force-pushed the M2-836-category-page-cumulative-layout-shift-in-both-desktop-and-mobile-browsers branch from b36467e to a56410d Compare June 30, 2022 09:24
@Frodigo Frodigo added this to the 1.0.0-rc.10 milestone Jun 30, 2022
@Frodigo Frodigo merged commit 2f2e86c into develop Jun 30, 2022
@Frodigo Frodigo deleted the M2-836-category-page-cumulative-layout-shift-in-both-desktop-and-mobile-browsers branch June 30, 2022 09:57
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants