Giter VIP home page Giter VIP logo

Comments (4)

robertpiosik avatar robertpiosik commented on August 26, 2024 1

Interestingly, I reinstalled blockman and it seems to be great now! Thanks for your responsiveness, have a good day :)

from vscode-blockman.

leodevbro avatar leodevbro commented on August 26, 2024

Hello, this is basically an optimization I implemented into Blockman. Somehow VS Code block rendering engine is too slow, for 1000 line file, it would take probably 10 seconds to render blocks for the entire file. And let's also consider the fact that one block (rendered by Blockman) is not one div box, it is div boxes on each line and they touch each other so there is an illusion of one big box. So, yeah, line by line div boxes means there can be thousands of div boxes if the file is large.

So, for optimization, Blockman renders blocks only in the current viewport area, and it listens to the scroll events and dynamically adjusts the blocks.

Yeah, probably the dynamic changes should not be so noticeable and so sluggish in usual web browser, but it seems that VS Code does not have as optimized API (for block rendering) as web browsers do.

To feel less sluggish scroll, you can increase this number:
"blockman.n31RenderIncrementBeforeAndAfterVisibleRange": 20

Default is 20, but you can set it to, like, 30, 40, 50. But more than 100 probably will slow down your environment so much. Just play with some numbers and you will find the most optimal number for you.
In my env, I have set it to 30.

from vscode-blockman.

robertpiosik avatar robertpiosik commented on August 26, 2024

Hmm, I don't think I stated what I meant clearly. I do understand rendering blocks do require work but as this work is not triggered during smooth scroll drag, it is when doing fast bidirectional drags.

Have you considered adding debouncing to your algorithm?

I'm using vim extension and scrolling few lines at a time. It would be great to debounce it as well.

Currently only smooth drag scrolls do not trigger block creation.

from vscode-blockman.

leodevbro avatar leodevbro commented on August 26, 2024

Well, Blockman uses a lot of debouncing, during text change events and also during scroll events.

Please see this video (Blockman scroll test):
(You can download it, if the online player plays it with low quality)
https://drive.google.com/file/d/1bwdz-HFohNzUT06YzDZG_esLAsI-m8R1/view

Sorry, I think I still don't understand what you see during scroll. In my env (in the video) I think the scroll behavior seems ok. Could you please record your video or something? So, I will be able to see the actual behavior.

You mentioned the vim extension. As I remember (If my memory is correct), I have heard some people had such kind of issues with Blockman when they had installed vim extension. Unfortunately I don't know what could be the cause of it.

from vscode-blockman.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.