N'utilisez pas de constructeur

Dans mon code, je n'ai pas utilisé constructor () . J'ai toujours vu des gens utiliser le constructeur dans des composants de classe, mais même si je ne l'utilise pas dans ce code, cela fonctionne parfaitement. Dans mon code, mettre l'état en dehors du constructeur, est-ce une bonne idée ou serait-il préférable d'utiliser le constructeur avec l'état défini à l'intérieur? Cela peut-il donner une sorte d'erreur à l'avenir ou aggraver les performances de mon système? Qu'est-ce qu'il est préférable de faire dans ce cas?

import React, { Component, Fragment } from 'react'
import  {Redirect} from 'react-router-dom'
import { connect } from 'react-redux'

import ActionCreator from '../redux/actionCreators'

import Button from '../elements/Button'

const statsgenre = {
'Ação': 'Action',
'Comédia': 'Comedy',
'Drama': 'Drama'
} 


const statsuser = {
'Assistido' : 'Watched',
'Assistindo': 'Watching',
'Assistir': 'Watch' 
}


class ScreensEditSeries extends Component{

state = {
    id: '',
    name: '',
    status: '',
    genre: '',
    notes: ''
}

componentDidMount = () => {    
    const serie  = {...this.props.match.params}
    this.props.load(serie)
    this.props.reset()
}

static getDerivedStateFromProps(newProps, prevState){
    let serie = {}
    if (prevState.name === '' || prevState.name === undefined){  
        if (newProps.series.serie.name !== prevState.name){
            serie.name = newProps.series.serie.name
        }

        if (newProps.series.serie.genre !== prevState.genre){
            serie.genre = newProps.series.serie.genre
        }

        if (newProps.series.serie.status !== prevState.status){
            serie.status = newProps.series.serie.status
        }
        if (newProps.series.serie.notes !== prevState.notes){
            serie.notes = newProps.series.serie.notes
        }
        return serie
    }           
}

saveSeries = () => {
    const {name, status, genre, notes} = this.state
    const id = this.props.match.params.id
    const newSerie = {
        id,
        name,
        status,
        genre,
        notes
    }
    this.props.save(newSerie)
}

handleChange = field => event => {
    this.setState({[field] : event.target.value})
}

render(){
    return (
        <Fragment>
            <div className="container">         
                <div>  
                    {this.props.series.saved  && <Redirect to={`/series/${this.props.match.params.genre}`}/>}
                    <h1 className='text-white'>Edit Série</h1>
                    {!this.props.series.isLoadding && <Button>
                        Name: <input type="text" value={this.state.name} onChange={this.handleChange('name')} className="form-control" /><br />
                        Status: {<span>&nbsp;</span>} 
                        <select value={this.state.status} onChange={this.handleChange('status')}>
                            {Object.keys(statsuser)
                                .map( key => <option key={key}>{statsuser[key]}</option>)}
                        </select><br/><br/>
                        Genre: {<span>&nbsp;</span>} 
                        <select value={this.state.genre} onChange={this.handleChange('genre')}>
                            {Object.keys(statsgenre)
                                .map(key => <option key={key}>{statsgenre[key]}</option>)}
                        </select><br/><br/>
                        Notes: <textarea type='text' value={this.state.notes} onChange={this.handleChange('notes')} className="form-control"></textarea><br />
                        <button className="button button2" type="button" onClick={this.saveSeries}>Save</button>
                    </Button>}
                    {this.props.series.isLoadding && <p className='text-info'>Loading...</p>}
                </div>
            </div>
        </Fragment>
    )
}
}

const mapStateToProps = state => {
return {
    series: state.series
}
}

const mapDispatchToProps = dispatch => {
return {
    load : serie => dispatch(ActionCreator.getSerieRequest(serie)),
    save: newSerie => dispatch(ActionCreator.updateSerieRequest(newSerie)),
    reset : () => dispatch(ActionCreator.seriesReset()),
}

}

export default connect(mapStateToProps, mapDispatchToProps)(ScreensEditSeries)