How can I solve a performance issue in blockly?

[Jay An(안재현)]

Hi,

I am new to blockly and currently working on how to optimize blockly blocks for performance improvement.

When more than 2000 blockly blocks are created and saved, I see massive lagging when the component is first rendered and blocks are dragged (I use React.js).

Even I collapsed blocks, the performance does not seem to improve.

How can I solve this performance issue? are there any articles or document that I can refer?

Thank you

[jimmy]

you are not alone here - i faced the same in the recent past and I never managed to solve this problem. For me, it would be fine even if it freezes initially and does not refresh each time when I click on the tool box pane..

I'm following this thread and hope that you would somehow be able to solve this.

Thanks
_____________________
Jimmy

--
You received this message because you are subscribed to the Google Groups "Blockly" group.
To unsubscribe from this group and stop receiving emails from it, send an email to blockly+u...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/blockly/4aac0c23-e71a-4529-b193-4e1b29dab7c5n%40googlegroups.com.

[Neil Fraser]

Can you recreate this issue on the playground?  I'm unable to observe significant lag with that block range.  My steps to recreate:

* Go to https://blockly-demo.appspot.com/static/tests/playground.html

* Click the "Airstrike!" button a couple of times, and click the "Spaghetti" button once (this produces a mix of top-level blocks and deeply nested ones).

* This command in the console reports that the number of blocks is 3266:

Blockly.getMainWorkspace().getAllBlocks(false).length

* Dragging has a few ms of lag, but nothing significant.

Blockly should absolutely be usable with 2k blocks.  Things do start to get sketchy as one approaches 10k blocks.  If you can't recreate on the playground, then maybe it's a React issue?

--

You received this message because you are subscribed to the Google Groups "Blockly" group.
To unsubscribe from this group and stop receiving emails from it, send an email to blockly+u...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/blockly/4aac0c23-e71a-4529-b193-4e1b29dab7c5n%40googlegroups.com.

--

Neil Fraser, Switzerland
https://neil.fraser.name

[Dummy PG]

@Neil On the playground that you shared, it seems that Spaghetti and JS Spaghetti slow down the rendering. It is very similar to my workspace where I only have ~1.7k blocks.
I am using blockly 9.2.1 on chrome  109.0.5414.75. For performance reference, Firefox does not seem to be affected and might only be happening on chromium-based browsers.
If there could be a proper benchmark and performance tuning for chromium browsers to solve this, that would be greatly appreciated. Thanks.

[Christopher Allen]

Hi Dummy PG,

@Neil On the playground that you shared, it seems that Spaghetti and JS Spaghetti slow down the rendering. It is very similar to my workspace where I only have ~1.7k blocks.
I am using blockly 9.2.1 on chrome  109.0.5414.75. For performance reference, Firefox does not seem to be affected and might only be happening on chromium-based browsers.
If there could be a proper benchmark and performance tuning for chromium browsers to solve this, that would be greatly appreciated. Thanks.

There's actually a bug open about Chrome-specific performance issues, although I note that you are the first to report problems with such a small number of blocks.  Is your computer particularly old/underpowered?  In any case, if you or anyone else has useful information about this issue it would be most welcome.  We've not been able to prioritise performance issues, but as it happens we have recently made some changes that may improve dragging performance on Chrome; those will be published in Blockly v9.3 (no release date set yet, but probably not later than the end of March).  If you're keen you could try building Blockly from the develop branch, test it out, and let us know if they've made any difference to you.

Christopher

[Dummy PG]

@Christopher, I am accessing the blockly workspace using HP Omen 16 i7 with 3060, I don't think this laptop is not capable of handling it. Anyway, that's great news having that improvement in place. Will probably try it at some point if its not merged anytime soon. Thank you. 

[Christopher Allen]

@Christopher, I am accessing the blockly workspace using HP Omen 16 i7 with 3060, I don't think this laptop is not capable of handling it.

That machine seems to be a current model and advertised as a gaming laptop, so lack of horsepower seems unlikely to be the cause of the poor performance you report.

[Dummy PG]

@Christopher, I tried to use develop branch to test out the performance fixes, I think it's built with TS, is there any documentation on how to migrate it if we have been using blocky in JS project?

[Maribeth Bottorff]

Hello,

When Blockly is built, it generates JS files, so there is no need for your project to use TypeScript if you don't want to. You can run `npm install` and `npm run package` to run the full build system and generate the compressed JavaScript files. Note that whether this works on Windows is currently unknown / not well supported, but it should work fine in Linux.

We are actually doing a release tomorrow however, so if you don't want to deal with building Blockly yourself, you won't have to wait long.

Note that the specific performance improvement Christopher previously linked won't be going in tomorrow's release (nor is it currently in develop branch) but there have been a few other performance-related changes so things may still improve.

Maribeth

[Dummy PG]

@Maribeth, Thanks for the response. I think I can wait for tomorrow's build. Currently serving it on linux for now.