Skip to content

Navigation Menu

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Appearance settings

scss compile performance improvement #196

sametsafak started this conversation in General
Discussion options

Hello,

I just figured out some performance issue with an scss function called luminance. I don't know what to do for solving or improving it but just wanted to inform.

I tried this with a fresh, empty coreui vue admin template. (@coreui/coreui-pro: 4.1.0)

Normally, when I edit anything in any scss file (like custom.scss), compile time is like 3000-5000 milliseconds.
But when I put a @return 1; in @coreui/coreui-pro/scss/_functions.scss:197 (luminance function's starting line) to prevent some calculations, It compiles 700 milliseconds.

Somehow, this function taking so much time and makings scss development a bit hard.

Edit: I tried to upgrade template with yarn upgrade command and now it takes even longer like 7000ms and somehow it compiles 2 times when i save anything. Maybe this can be another issue in v4.1.4.

Edit2: To learn which versions of packages users have, you can ask users to use this command while creating an issue:
npx envinfo --system --npmPackages '{coreui,@coreui/*}' --binaries --browsers
It can be a good touch :) here is my export:

  System:
    OS: macOS 12.2.1
    CPU: (10) x64 Apple M1 Max
    Memory: 6.56 GB / 64.00 GB
    Shell: 5.8 - /bin/zsh
  Binaries:
    Node: 14.18.2 - /usr/local/bin/node
    Yarn: 1.22.17 - /usr/local/bin/yarn
    npm: 6.14.15 - /usr/local/bin/npm
  Browsers:
    Chrome: 99.0.4844.51
    Safari: 15.3
  npmPackages:
    @coreui/chartjs: ^3.0.0 => 3.0.0 
    @coreui/coreui-pro: ^4.1.0 => 4.1.4 
    @coreui/icons: ^2.1.0 => 2.1.0 
    @coreui/icons-vue: ^2.0.0 => 2.0.0 
    @coreui/utils: ^1.3.1 => 1.3.1 
    @coreui/vue-chartjs: ^2.0.0 => 2.0.1 
    @coreui/vue-pro: ^4.1.0 => 4.1.4 
You must be logged in to vote

Replies: 1 comment

Comment options

The luminance function is necessary from the accessibility point of view. It calculates each color.

See https://www.w3.org/WAI/GL/wiki/Relative_luminance
See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests

You must be logged in to vote
0 replies
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
2 participants
Converted from issue

This discussion was converted from issue #195 on March 13, 2022 13:49.

Morty Proxy This is a proxified and sanitized view of the page, visit original site.