Rpt2 slow as hell

[zerkalica]

Demo repository: https://github.com/zerkalica/rpt2-bug package.json

  "devDependencies": {
    "rollup": "^0.57.1",
    "rollup-plugin-commonjs": "^8.4.1",
    "rollup-plugin-node-resolve": "^3.3.0",
    "rollup-plugin-typescript2": "git+https://github.com/ezolenko/rollup-plugin-typescript2#823fea9525f274db0512947dd7bb77b916d7bba1",
    "typescript": "^2.8.3"
}

rollup.config.js

import resolve from 'rollup-plugin-node-resolve'
import common from 'rollup-plugin-commonjs'
import tsPlugin from 'rollup-plugin-typescript2'

import path from 'path'

const tsOptions = {
  abortOnError: true,
  check: false,
  clean: false,
  tsconfig: path.join(process.cwd(), 'tsconfig.json'),
  //verbosity: 5,
  tsconfigOverride: {
      compilerOptions: {
        rootDir: path.join(process.cwd(), 'src'),
        declaration: false
      },
      include: [ path.join(process.cwd(), 'src') ]
   }
}

export default [
  {
    plugins: [
      resolve(),
      common({
        namedExports: {
          react: ['createElement', 'Component'],
          'react-dom': ['render'],
        }
      }),
      tsPlugin(tsOptions)
    ],
    input: 'src/index.tsx',
    output: {file: 'dist/index.js', format: 'iife', name: 'myApp'}
  }
]

src/index.tsx

import * as React from 'react'
import * as ReactDOM from 'react-dom'

class DevErrorCatch extends React.Component<{}, {error?: Error, componentStack: any}> {
    state = {error: null, componentStack: null}

    componentDidCatch(error, {componentStack}) {
        this.setState({error, componentStack})
    }

    render() {
        const {error, componentStack} = this.state
        if (error) {
            return <div>
                <h1>{error.message}</h1>
                <pre>{componentStack}</pre>
                <br/>
                <pre>{error.stack}</pre>
            </div>
        }
        return <div>test</div>
    }
}

export default function main(node: Element) {
    ReactDOM.render(<DevErrorCatch/>, node)
}

npm run watch.rpt2

Build time: 3.6s, Warm rebuild time: 2.1s

npm run watch.parcel

Build time: 5.4s, Warm rebuild time: 0.6s

In my project about 2K SLOC, rebuild time in watch mode about 5-6 s in rpt2. Parcel - about 930ms.

If enable verbosity: 5 - process crashed with out of memory or do inifite writes to console after changing file in watch mode.

[ezolenko]

I don't think I can take credit for the whole of rollup here. :) If you want to measure effect of rpt2 on performance, pre-compile all ts files and compare rollup with rpt2 vs rollup using pre-compiled js files.

I know it probably has worse performance than awesome-typescript-loader on webpack side and there is room for cache loading optimizations, but ultimately plugin is driven by rollup.

My own project, about 20K sloc, cold builds in 18-20s and rebuilds in 5-6s.

Using full verbosity in watch mode will kill things for sure, although there should be no memory leaks, I thought I fixed that sometime ago.

[zerkalica]

But why parcel faster without any cache and optimizations on simplest TypeScriptAsset?

[ezolenko]

Check this out for some of the reasons: https://github.com/parcel-bundler/parcel/issues/392

[ezolenko]

Looks like it does less work than rollup and it does it faster too (because it processes the files in parallel)

[marijnh]

Would it be possible to add a 'fast mode' where TypeScript error checking is suppressed? I recently used rollup-typescript, another fork, which ran a lot faster and also seems to be using the TypeScript 2 compiler. It's broken in other ways, so I guess this is currently the most promising-looking project in this space, but during debugging I really prefer fast build types to error checking (my editor already shows me the errors).

(If you think this'd make sense and can point me in the right direction, I'll gladly work on a PR.)

[ezolenko]

@marijnh yep, already there, set check: false in plugin options. Let me know if it improves things, could be slightly faster than original plugin on rebuilds.

[marijnh]

Hm, I have that set, but it doesn't seem to make much difference (build time is about the same).

[marijnh]

Okay, hold on, it's still checking (I can trigger errors). I'm using the plugin like below, which seems like it should set the option.

import typescript from "rollup-plugin-typescript2";
export default {
  input: "./view/test/test.ts",
  output: { ... },
  plugins: [
    typescript({
      check: false,
      tsconfigOverride: {...}
    })
  ]
}

[marijnh]

Oh, it's related to rollup -w -- I do see the speedup in non-watch mode. See #82