pradel / create-react-app-swc

Use swc in your create-react-app for faster compilation, development and tests
MIT License
129 stars 11 forks source link

`craco-swc` is set and builded successfully, but build time is not improved #27

Open min9nim opened 2 years ago

min9nim commented 2 years ago

There was many error and hard things for setting. But I finally applied craco-swc.

Build is successfully, but build time is same with the before.

Is this builded with SWC right?


$ CI=false craco build
Creating an optimized production build...
Compiled with warnings.

src/ui-component/svgs/ClearIcon.tsx
  Line 1:11:  'IProps' is defined but never used  no-unused-vars
  Line 1:11:  'IProps' is defined but never used  @typescript-eslint/no-unused-vars

src/views/basic/channels/MediaTitleSection.tsx
  Line 16:21:  img elements must have an alt prop, either with meaningful text, or an empty string for decorative images  jsx-a11y/alt-text

src/views/basic/extract/ExtractData/Methods.tsx
  Line 6:13:  'methods' is assigned a value but never used  no-unused-vars
  Line 6:13:  'methods' is assigned a value but never used  @typescript-eslint/no-unused-vars
  Line 6:22:  'set' is assigned a value but never used      no-unused-vars
  Line 6:22:  'set' is assigned a value but never used      @typescript-eslint/no-unused-vars

src/views/basic/extract/ExtractData/SelectMethod.tsx
  Line 9:13:  'fileFormat' is assigned a value but never used  no-unused-vars
  Line 9:13:  'fileFormat' is assigned a value but never used  @typescript-eslint/no-unused-vars
  Line 9:25:  'cronExp' is assigned a value but never used     no-unused-vars
  Line 9:25:  'cronExp' is assigned a value but never used     @typescript-eslint/no-unused-vars
  Line 9:51:  'set' is assigned a value but never used         no-unused-vars
  Line 9:51:  'set' is assigned a value but never used         @typescript-eslint/no-unused-vars

src/views/basic/extract/ExtractStatus.tsx
  Line 18:9:  Expected { after 'if' condition  curly

src/views/basic/settings/manage-member/DialogAllowRequest.tsx
  Line 7:8:  'NoticeIcon' is defined but never used  no-unused-vars
  Line 7:8:  'NoticeIcon' is defined but never used  @typescript-eslint/no-unused-vars

Search for the keywords to learn more about each warning.
To ignore, add // eslint-disable-next-line to the line before.

File sizes after gzip:

  365.42 kB  build/static/js/main.c22e64ac.js
  130.82 kB  build/static/js/735.db0611e8.chunk.js
  33.18 kB   build/static/js/886.c26cd2e9.chunk.js
  20.05 kB   build/static/js/678.1f9547b2.chunk.js
  13.41 kB   build/static/js/344.505da510.chunk.js
  10.17 kB   build/static/js/555.3e14bb8d.chunk.js
  9.17 kB    build/static/js/87.dffa06c0.chunk.js
  7.98 kB    build/static/js/493.99df19b2.chunk.js
  7.62 kB    build/static/js/36.c2de9bbb.chunk.js
  7.09 kB    build/static/js/294.4c0b979f.chunk.js
  6.93 kB    build/static/js/857.e85c113b.chunk.js
  6.06 kB    build/static/js/17.2e43309d.chunk.js
  5.77 kB    build/static/js/197.e7058c6e.chunk.js
  5.68 kB    build/static/js/244.582fe0f6.chunk.js
  4.99 kB    build/static/js/792.8f22dbde.chunk.js
  4.92 kB    build/static/js/234.d3cbfd63.chunk.js
  4.38 kB    build/static/js/523.0d685f5f.chunk.js
  4.24 kB    build/static/js/728.5cf0ee71.chunk.js
  3.74 kB    build/static/js/313.01f92276.chunk.js
  3.46 kB    build/static/js/131.0759c005.chunk.js
  3.45 kB    build/static/js/165.56692534.chunk.js
  3.23 kB    build/static/js/667.15df853b.chunk.js
  3.06 kB    build/static/js/641.b42e0f10.chunk.js
  2.85 kB    build/static/js/170.8ee6c5a2.chunk.js
  2.68 kB    build/static/js/469.2d7ebb8e.chunk.js
  2.43 kB    build/static/js/966.4e58be79.chunk.js
  2.33 kB    build/static/js/867.d65eb47c.chunk.js
  2.01 kB    build/static/js/182.722a9efa.chunk.js
  2.01 kB    build/static/js/319.ea761dd3.chunk.js
  1.91 kB    build/static/js/592.cb7bb8c6.chunk.js
  1.8 kB     build/static/js/720.e1880a9b.chunk.js
  1.78 kB    build/static/js/787.88e3aee4.chunk.js
  1.66 kB    build/static/js/517.ae9dd1c9.chunk.js
  1.41 kB    build/static/js/584.ecef28f0.chunk.js
  1.33 kB    build/static/js/74.035de2b8.chunk.js
  1.23 kB    build/static/css/main.8ae4e198.css
  1.23 kB    build/static/js/80.2178ad19.chunk.js
  509 B      build/static/js/773.22552805.chunk.js
  308 B      build/static/js/683.2c3de2c4.chunk.js
  304 B      build/static/js/581.ff1bd043.chunk.js
  303 B      build/static/js/809.7651cc27.chunk.js

The project was built assuming it is hosted at /.
You can control this with the homepage field in your package.json.

The build folder is ready to be deployed.
You may serve it with a static server:

  yarn global add serve
  serve -s build

Find out more about deployment here:

  https://cra.link/deployment

✨  Done in 71.14s.

Process finished with exit code 0

How do I confirm whether swc is used or not on build?

// craco.config.js
const CracoSwcPlugin = require('craco-swc')

module.exports = {
    plugins: [
        {
            plugin: CracoSwcPlugin,
            options: {
                swcLoaderOptions: {
                    jsc: {
                        externalHelpers: true,
                        target: 'es5',
                        parser: {
                            syntax: 'typescript',
                            tsx: true,
                            dynamicImport: true,
                            exportDefaultFrom: true,
                        },
                    },
                },
            },
        },
    ],
}
andrewnaeve commented 2 years ago

Yeah, build time significantly worse over here. Increased by 30 seconds.

gabriel-lima96 commented 2 years ago

Same here. On a fresh CRA installation the build time got from 9s to 10s.

pavelloz commented 2 years ago

Yeah, 3.41 vs 3.29 here. Improvement on a statistical error level.

martsie commented 1 year ago

No improvements over here ... babel with file cache was faster to compile.