How to optimize the logic of thousands of lines of code for a single vue component?

how to optimize when thousands of lines of code are written in a single component of vue? (rule out why molecular components are no longer fine)

does encounter this problem in the project, because subdividing components brings more complex problems, so basically all logical interactions are placed in this component, and the code is written by ts.

as there are more and more functions, it is more troublesome to find a method, but the logic will become more and more confused.

my current solution to refactoring code is:
(mixins, is not used here because mixin can"t solve some data interaction problems)
logical classification, modularization

|- Canvas
    |- selector
    |- selectorManage

The

code is roughly as follows:

import SelectManage from "./selectManage";
import Selector from "./selector";
export default class Canvas {

    public selector: any = {};

    public selectManage: any = {};

    private vm: any = undefined;

    constructor( argments ) {
        const { vue } = argments;
        this.selector = new selector();
        this.selectManage = new selectManage();
        this.vm = vue;
    }

}
    
vuevue...

I don"t know what impact this will have on performance by passing vue as a parameter to the module.
does anyone else know how to optimize such code?