Source: Moeomu’s blog

Problem Reproducible

• Reproducible: Yes
• Host system: macOS BigSur 11.6
• Virtual machine system: Ubuntu Desktop 20.04.3
• Parallels Virtual Machine version: 17.0.1
• Description of the problem: After installing or running NodeJS-based applications, especially Electron, the application will take up 1/4 of the white screen and 3/4 of the black screen with abnormal display, which cannot be used normally
• Typical application failure.
  • VSCode
  • Motrix
  • Typora

Solutions

Solution 1

Add a startup parameter -disable-gpu to each Electron application

Add: This can be achieved by creating a shortcut on the desktop, using vscode as an example, with the following content

code.desktop

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20

[Desktop Entry]
Name=Visual Studio Code
Comment=Code Editing. Redefined.
GenericName=Text Editor
Exec=/usr/share/code/code --disable-gpu --unity-launch %F
Icon=com.visualstudio.code
Type=Application
StartupNotify=false
StartupWMClass=Code
Categories=Utility;TextEditor;Development;IDE;
MimeType=text/plain;inode/directory;application/x-code-workspace;
Actions=new-empty-window;
Keywords=vscode;

X-Desktop-File-Install-Version=0.24

[Desktop Action new-empty-window]
Name=New Empty Window
Exec=/usr/share/code/code --disable-gpu --new-window %F
Icon=com.visualstudio.code

Solution 2

Turn off the graphics-hardware acceleration for Parallels/other virtualization software - this virtual machine, as shown below

Additional Information

The official developers of Electron mention on Github

You can probably disable GPU acceleration to work around this, or just use another visual machine software. Basically the GPU acceleration of Linux in virtual machines is a mess, depending on the software of visual machine, the version and distribution of Linux, and the version of Chromium, you can get various results and bugs.

• Linux’s virtual machine hardware acceleration is a mess, so it’s normal for this to happen