Skip to content

Conversation

joanagmaia
Copy link
Contributor

@joanagmaia joanagmaia commented Mar 17, 2023

Changes proposed ✍️

  • Update no-console rule in eslint configuration
    • Warn for all console types except for the allowed ones, error and info
  • Remove unnecessary console.log scattered through the app. Update some console.log to be console.error or console.info
  • Remove unused packages from package.json: apollo-boost, graphql, jsonwebtoken, md5, regenerator-runtime
  • Update some packages to new ones that are more lightweight:
    • emoji-toolkit to node-emoji. Unpacked Size from (6.18 MB) to (429 kB) emoji-toolkit was causing the dashboard page to freeze. By updating to a new package, the performance significantly improved
    • xlsx to papaparse. Unpacked Size from (7.5 MB) to (224 kB)
  • Update ways of importing Inter font and remixicon
    • They are now being imported in index.html with a mechanism of preload. This should improve performance, and prevent the fetching of these resources to block the page
  • Update Element plus way of import
    • Change from Full Import to On-Demand Import. This reduced the package size significantly as we are now only importing the used components
  • Update way of using lodash. Now it's only importing the specific methods, and not the entire lib
  • Delete unused code and exports
  • Add plugins and update webpack configuration to improve performance and development
    • Both unplugin-auto-import and unplugin-vue-components allow to have Element Plus imported by demand
    • webpack-deadcode-plugin allows to log into the console unused code
    • webpack-bundle-analyzer creates an interactive treemap visualization of the contents of all bundles (disabled unless analyzerMode is updated)
    • terser-webpack-plugin helps to minify/minimize JavaScript
    • css-minimizer-webpack-plugin helps to optimize and minify CSS
    • mini-css-extract-plugin extracts CSS into separate files. It creates a CSS file per JS file which contains CSS. It supports On-Demand-Loading of CSS and SourceMaps
    • optimization.splitChunks indicates which chunks are selected for optimization

Checklist ✅

  • Label appropriately with Feature, Enhancement, or Bug.
  • Tests are passing.
  • New backend functionality has been unit-tested.
  • Environment variables have been updated:
    • Local frontend configuration: frontend/.env.dist.local, frontend/.env.dist.composed.
    • Local backend: backend/.env.dist.local, backend/.env.dist.composed.
    • Configuration docs have been updated.
    • Team members only: update environment variables in override, staging and production env. files and trigger update config script.
  • API documentation has been updated (if necessary) (see docs on API documentation).
  • Quality standards are met.
  • All changes have been tested in a staging site.
  • All changes are working locally running crowd.dev's Docker local environment.

@joanagmaia joanagmaia self-assigned this Mar 20, 2023
@joanagmaia joanagmaia added the Improvement Created by Linear-GitHub Sync label Mar 20, 2023
@joanagmaia joanagmaia force-pushed the bug/application-frozen-loading branch from 50af97b to 09132d0 Compare March 20, 2023 14:00
@joanagmaia joanagmaia marked this pull request as ready for review March 20, 2023 14:00
@joanagmaia joanagmaia requested a review from gaspergrom March 20, 2023 14:00
@joanagmaia joanagmaia merged commit 687f69e into main Mar 22, 2023
@joanagmaia joanagmaia deleted the bug/application-frozen-loading branch March 22, 2023 08:58
joanreyero pushed a commit that referenced this pull request Apr 29, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Improvement Created by Linear-GitHub Sync
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants