Rendering of the canvas deteriorates proportionately with the size?

Can someone explain to me how I can avoid the drop in performance of drawing on a canvas, as its size grows?
What is the reason for this?

Run even on a canvas runs more slowly, as the canvas size.

It also seems that, despite "dirty zone" rendered using JavaFX technology, rendering the scene becomes slower as the size of nodes increases (e.g.: the canvas).
even if most of it is off-screen. Speed is acceptable when the canvas completely fills my screen size, then the entire screen should already be redrawn.
but as I increase the size, so the node/canvas already extends outside of the window, made performance continuously decreases as the node expands.

It is corrected, when setCache (true) is applied.
However, this does NOT improve drawing performance on the Web, where low latency is essential for a painting application.
Who seems to be involved, as the documentation advises NOT to Cache, if the node changes frequently.
Surprisingly then, still cached to True on the Web currently drawn on, more CacheHint = SPEED, seems to improve a little speed.

Anyway, back to the question: why is based on a painting becomes slower with the size, although the same race, covering the same amount of area, is performed?

My apologies if I seem confused or repeated myself, I am extremely tired. Thank you in advance and good night.

It's a beautiful Shindoh descriptive answer.  You have a talent for this sort of thing.

Reproduce your problem

Your application does not work even on my machine (Java 8u5, Win 7, 64 bit, ATI Radeon HD 4600), except if I drop the size of the canvas to 8Kx8K (probably because I use an older graphics with capabilities of textures limited).  I drop the size of the canvas, I noticed improvements in performance that outline you, 8 k is really slow to update and pretty unusable at 1 K being quite catchy.

The exception I get a canvas of 10Kx10K is =>

java.lang.NullPointerException

to com.sun.javafx.sg.prism.NGCanvas$ RenderBuf.validate (NGCanvas.java:199)

at com.sun.javafx.sg.prism.NGCanvas.initCanvas(NGCanvas.java:598)

at com.sun.javafx.sg.prism.NGCanvas.renderContent(NGCanvas.java:575)

at com.sun.javafx.sg.prism.NGNode.doRender(NGNode.java:2043)

at com.sun.javafx.sg.prism.NGNode.render(NGNode.java:1951)

at com.sun.javafx.sg.prism.NGGroup.renderContent(NGGroup.java:225)

at com.sun.javafx.sg.prism.NGRegion.renderContent(NGRegion.java:575)

at com.sun.javafx.sg.prism.NGNode.doRender(NGNode.java:2043)

at com.sun.javafx.sg.prism.NGNode.render(NGNode.java:1951)

at com.sun.javafx.tk.quantum.ViewPainter.doPaint(ViewPainter.java:469)

at com.sun.javafx.tk.quantum.ViewPainter.paintImpl(ViewPainter.java:324)

at com.sun.javafx.tk.quantum.PresentingPainter.run(PresentingPainter.java:89)

to java.util.concurrent.Executors$ RunnableAdapter.call (Executors.java:511)

at java.util.concurrent.FutureTask.runAndReset(FutureTask.java:308)

at com.sun.javafx.tk.RenderJob.run(RenderJob.java:58)

at java.util.concurrent.ThreadPoolExecutor.runWorker(ThreadPoolExecutor.java:1142)

to java.util.concurrent.ThreadPoolExecutor$ Worker.run (ThreadPoolExecutor.java:617)

to com.sun.javafx.tk.quantum.QuantumRenderer$ PipelineRunnable.run (QuantumRenderer.java:129)

at java.lang.Thread.run(Thread.java:745)

A few suggestions

10Kx10K is a very large canvas.

Creation of such a thing is a really a kind of brute force solution.

I think that you would need to get smarter about manage you such situations.

In my view, relying on the library to manage the optimization of these paintings is not the way to go.

Of course, the library can handle OK, but your tests show otherwise, so you'll have to work on a different solution.

What you can do, is take some knowledge of the specific area of your application to help optimize the use of the canvas so that you can get with a smaller canvas.

For example, consider the technique involved in the drafting of an engine of tile in JavaFX. It is average for the rendering of graphics games such as Pokemon or Zelda on a canvas, old-school style.  There is a support data format that is the TileMap, there are control logic that keeps track of the coordinates of the currently visible TileMap and there is a rendering engine that makes just the coordinates of tile currently visible on the screen.  You can apply a similar approach to your application - this would allow you to limit the size of the canvas limited to just the size of the portion of the visible screen.  Of course the nature of TileMaps make them especially well optimized for this approach, so the solution is not directly transferable to your application.

Another project that demonstrates rendering an area almost infinitely great is the Grezi project that defines a JavaFX zoomable user interface, although it uses the SceneGraph and not canvas for this.

The question may be "why should I should I put the extra mention, more complex logic in my code to draw effectively on a canvas? ' that is ' Why can't the library take care of these things for me?  I think the answers are:

1. the current implementation of the Web on various platforms may not completely optimized for the treatment of the dirty area and overflow in the visible region to the areas off the screen.

2. the implementation of the Web cannot make use of any domain specific design optimizations that your application may be familiar with.

3. you qualify for an architecture of MVC type for your design in any case.

4. the needs of canvas to deliver a very versatile solution that makes it work well in many situations, but may be not optimal for your particular situation.

See for example-online the best optimizer is between your ears.

You might want to try another option is to use the SceneGraph instead of a canvas.  The optimization of the library around the larger scene graphs and area sale/offscreen surface treatment can be more effective in the case of SceneGraphs compared to paintings, particularly in the case of graphs of scene quite sparsely populated.

No matter what you do, if you want to render the box for 4 K screens, I think that JavaFX (and even some of his other computer pipeline components such as native libraries, drivers graphic, material interfaces screen etc), are not particularly well optimized for the treatment of these high resolutions at the moment.  This is likely to change over time, but expect problems of teeth if you try to make these resolutions at the moment.

Another thing that I remember is that, to a lesser degree, JavaFX makes often content to the textures on a video card.  Most video cards have some sort of limit to the maximum size of texture and when this limit is reached, to do a layer of additional conversion somewhere in the library code that maps the content to several textures video card and when this way of rendering is called, things slow down significantly.  This limit may be generally around 8Kx8K 4Kx4K (I'm not sure).

My guess is that this is probably not the answer you wanted ;-)

Tags: Java

Similar Questions

  • Rendering of the HTML5 Canvas

    This is regarding the rendering of the scene animation HTML5 Canvas (animate CC).

    The rendering of the animation is slow on the Windows operating system. And rendering animation is not smooth on browser.

    Please provide any solution for this.

    Few things to note everything by publishing your files to HTML5 canvas target.

    1. the filters and effects of color on the symbols are very expensive by the calculation and are cached (automatically) while rendering. Try to reduce as much as possible these as they will cause the internal animation within any symbol of caching to freeze.

    2. try to use the Cache as Bitmap to the complex static vector shapes wherever possible.

    3 try to minimize acceleration in the classic tweens.

  • Rendering of the texts of the composer issues each line with Adobe Media Encoder

    I find the paragraph of text defining "Each Adobe line Composer" a huge time saver when dealing with large amounts of text in the aftermath. I rarely have to do manual breaks follow-up or line to make look it good, rather than working with the standard single-line composer.

    The problem is that when I give thanks to Adobe Media Encoder (which I have to do because they removed H264-mp4 AE:s internal renderer support) the text is treated as a single line of typeset text. If the final result does not resemble my AE project.

    I found two solutions to this problem:

    1. make a video file without loss in the AE render engine and then compress him with Media Encoder. It takes more time and HARD drive space, and it did not allow me to continue working at AE while rendering.

    2. only use single line text composed and make all the settings manually, the old school way. It would not be a problem if I had not already used and fell in love with, the option of each line.

    Is there someone who can think of a third and better preference, solution?

    I use both CC 2014 of AE and AMC.

    Looks like you have found a bug that has never bitten me before and has nothing to do with h.264 compression. Here's the rendering of your text to a tiff file.

    I have filed a bug report and suggest you do the same.

  • canvas size changes with the size of the image

    I am just placing several small pictures on a postcard.  When I go to change the size of the image, it narrows the whole canvas.

    Is there some sort of setting I need to uncheck?  I don't do anything with the size of the canvas.  I want it to stay the same.

    Thank you

    As nickna12 said, if the resolution of the picture you want to insert in the model is less than the resolution of the model, it will be re-size to fit the resolution of the new location.

    To insert images without having to worry about the size or resolution: insert images into the postcard file, each on a separate layer and transform each layer in dynamic object (right click on the layer containing each picture and select convert to smart object). In this way, you can resize images from top to bottom and upward once again without worrying about degrading image quality.  On each layer, use the recommended that Noel command (Edit - transform - scale or Edit - free transform) to re - scale each image as you wish. You can use the move tool (black arrow) to move each image in place.

    If you want to "away from the cultures' parts of the inserted picture, you can do so with a layer mask.  One way to do that is:

    • Select the layer with the image that you want to "crop".
    • Add a layer mask: layer - layer mask - reveal all the (adds a layer mask filled with white, so that you can always see your image)
    • Select the layer mask in the layers panel
    • Use a tool like the rectangular selection tool to select the part of your image that you wish to be visible.
    • Invert the selection: Select - Inverse. This selects everything except the part of the image you want to remain visible.
    • Fill the selection with black to hide it away: Edit - fill - (select black as the fill color)
    • Get rid of the selection: select - deselect

    You can use the move tool to move your image hidden anywhere you want on your postcard.  If you decide you want it is larger or smaller, you can use the Edit - Transform command to resize it, rotate, etc.

    In Photoshop, there are always several ways to accomplish tasks, and there may be better ways to achieve this way

  • What is the size of the image used to render the list (for list image rendering)?

    Hello!

    Can u please tell me, what is the size of the image used to represent the listItem. I used the size 40 x 40 for listitems, but the listitem be merged with another. Image will not be rendered with the size (actual size).

    PLS, suggest me-

    ListIField generally uses a height up to the police on the storm no devices. The storm, it has a fixed size greater than the height of the font.

    If you want to draw a picture of 40 x 40, you need minimum height of 40px. Call setRowHeight (40) in the constructor of the listfield.

  • button is not rendered in the parent page after setting the condition made in popup.

    Hi all

    I have a page test.jsf where I have a button called display window confirmation with condition rendered as below

    < af:button text = "show the Confirmation window" id = "b8".

    actionListener = "#{TableShuttleBean.showConfirmationWindow} '"

    rendered = "#{TableShuttleBean.popUpCheckBox.Value == true} '/ > "

    I call a popup based at the click of another button. Where I gave an option so that the user doesn't show this confirmation again window. Once the user sets this checkbox and close the pop-up window. I display a button in my test. JSF which will allow the user to restore to the original setting.

    < af:popup.

    a code

    < af:selectBooleanCheckbox shortDesc = "#{bindings." EmployeesView1.hints.Selected.tooltip}.

    ID = "sbc22" text = "don't show this window again"

    Binding ="{tableshuttlebean.popupcheckbox}" / > "

    < / af:popup >

    I put the partial trigger for the OK button of the pop-up window to the form of the page parent element, but it does not work. I'm not able to update my parent page and show the button.

    My apologies if I'm not able to explain my problem clearly.

    Thank you

    Mozakkir

    Mozakkir, please indicate your Jdev version!

    You cannot use the property made for it. Once the rendering of the property is false, the component he remembers of the tree and is not shown again without a full page refresh. However, you are only a partial new.

    The visible property of the user instead that just hides the component and allows to show later with a partial refresh.

    Timo

  • Are you able to change the size of the canvas?

    Hello! I would like to change the size of the project up to 1920 X 1080 is it possible?

    I'm pretty sure that currently available from Adobe sketch canvas size is 2048 x 1536 (at least).

    Fortunately, HD video is smaller (1920 x 1080).

    Create a model of 1920 x 1080 in Photoshop, then save it in your library of CreativeCloud.  It is often useful to create a guide with title safe and action safe too!

    In Adobe Sketch, place the model in a new layer and use it as your guide layer.  If you send this to Photoshop later, it'll be really easy to crop to the guide layer - and maintain your elements and design layout.

  • Photoshop 7 (Windows 10), when you select the size of the Image or the size of the canvas, now crashes

    Photoshop 7 (Windows 10), when you select the size of the Image or the size of the canvas, he now is suspended and does not bring the selector upwards.

    It works fine, but I suspect that some Win 10 update in the last couple days has skewed anything. Any ideas?

    I know it of old, but even after the upgrade to Windows 10 4 weeks, Photoshop 7 installed always OK, so I'm happy with it.

    It worked until yesterday.

    I could start by resetting the photoshop preferences file and see if that solves the problem.

    Press on and hold Shift + Ctrl + Alt just after the beginning of the launch of photoshop 7

    (you have to be fast while pressing down or you won't get the dialog box)

    Keep possession of the keys down until you get a dialog box asking if you want to delete the adobe photoshop settings file

    Press Yes






    Also, if you have not applied the update of photoshop 7.0.1 you should do the same.


    Adobe - Photoshop: For Windows: Adobe Photoshop 7.0.1 update

  • I want to export file to a specific size without changing the size of the contents of the layer. for example. the image in the layer size is 20 x 20 px, but I want the file exported in 40x40px with a transparent space.

    I want to export file to a specific size without changing the size of the contents of the layer. for example. the image in the layer size is 20 x 20 px, but I want the file exported in 40x40px with a transparent space. @divyamanian

    You can now do with the new export as a dialogue using the "Canvas size" section

  • Is there a way of only not to run a query on the rendering of the table?

    Is there a way of only not to run a query associated with an af:table on the rendering of the table on the page?
    I want to this control programmatically.

    Examples will be very appreciated.

    Yes, there is.

    {: identifier of the thread = 2362354}

  • OEM Apple nVidia GeForce 7300 GT is on the list of Adobe to not support GPU for rendering of the Open GL...

    My Mac Pro Radeon X 1900 XT is retired to my yard serious computer in my basement, but that goes back to the OEM Apple nVidia GeForce 7300 GT, brought encouraging results delivered with my Mac Pro.

    When I got the Mac Pro 2007, in 2009, I was running it in Mac OS 10.4.4.11 Tiger and Photoshop CS4 (11.0.0) would turn off the Open GL rendering when it detected the GeForce 7300 GT card stock, which was on the list of unsupported graphics nVidia GPU Adobe.   So, I bought a refurbished nine Apple Radeon X 1900 XT.  This card allowed to Photoshop CS4 and Bridge CS4 allow Open GL rendering.  Last year, the Radeon X 1900 XT graphics card created scratches on my screen when it is running hot and sometimes dual turns off just as I was working.  In addition, the computer was material freezes about once a day.   This morning the Mac Pro close its dual display, while I was working, and I had to make another cold cut in order to restart.  I then manually shut down the computer and doing a manual start so that Snow Leopard would use disk maintenance.

    I turned off the computer and pulled the Radeon X 1900 XT card and re-inserted the OEM Apple nVidia GeForce 7300 GT card.  Now I'm in Mac OS 10.6.8 Snow Leopard with Photoshop CS4 (11.0.2) instead of Photoshop CS4 (11.0.0).

    Now, the update to Photoshop CS4, under the most recent operating system, allowing rendering Open GL instead of disable. Physical limitation of this graphics card is now fixed, so I see no reason to buy the ATI Radeon HD 5770 Graphics Upgrade Kit for my Mac Pro:

    http://eShop.MacSales.com/item/Apple/6615718/

    Some of those who bought the Apple ATI Radeon HD 5770 will say that they always got the striping on their screen when the Radeon HD 5770 card was running hot, just like with the Radeon X 1900 XT.

    So far, Apple OEM nVidia GeForce 7300 GT works fine and I get no striping on my poster without shut-off or material display freezes.

    I'm happy to have made of Open GL to Adobe enabled with an OEM GPU graphic that works cool and requires no fan cooling anchored.  Apple OEM nVidia GeForce 7300 GT, for the Mac Pro, is on the list of Adobe to not support GPU for rendering of the Open GL under Photoshop CS4, so why is he now supported?  That is just one of the benefits of the Photoshop CS4 11.0.2 update?

    Also FYI, Adobe is not always announce or specify bug fixes in versions of update of an application, although sometimes they do.

  • reduce the size of the canvas in preview?

    I designed the layout of our website to the company using Fireworks cs4 and then exported the Dreamweaver cs4 site. The size of the canvas used for the site is 1000 (wide angle) and 900 (height). When I go to preview the site using firefox or IE the width of the canvas is bigger than 1000 px I designed in Fireworks. The height is good to 900 px. Everything else works well. How can I change the size of the width of the site, it is only of 1000px? Sorry if this is a fundamental issue. I m quite new for dreamweaver

    Hello

    HM, my screen resolution is set to 1280 x 1024 px and I'm sorry, in my IE8 everything seems fine, your Web site in my IE8 is mapped entirely correct. The only thing I noticed is alignment to the left, I would try to center the page with a

    .

    Hans G.

  • Creating a spike in "panorama"... need advice on the size of the canvas

    Hello... I want to make a panorama style shot of my article in my house. I think that the shot doesn't consist of 3 pictures, no more. My question is what size should I make the canvas if the photos are 2848 x 2136? They will be stuck with an older camera I'm pulling in 6.3 megapixels. Thanks for the help.

    First create a new empty file - use the file... New... PhotoMerge Panorama, then choose the photos that you want to use, and then select "blend the images.  PSE will automatically create the photo panoramic full size for you and you won't have to worry about the size of the canvas.

    Ken

  • Rendering of the poor to the player, fine fonts in Pro

    I also have good Adobe acrobat reader 9 and Adobe Acrobat Pro.
    I usually just read the documents with the player, but recently, I find that the player gives a very bad police, even at 100% resolution, but Pro gives an excellent rendering of the same documents to any scale. Printing is being discovered.

    What can be broken with drive - is the latest version?

    I had the same problem that has only recently begun. I think it has to do with the Flash Player updates.

    I've updated to 10 player and also the last Flash Player directly from the Adobe site and the problem has been resolved. Resolution went from barely readable even expanded to clear Crystal with default settings. I was using Reader 9 and he told me that there are no more updates. My guess is that these latest Flash Player updates were not compatible Reader 9.

    In any case, I think that this will solve your problem.

  • Need help with the size of the image/print in Photoshop CS

    I drew a picture with a number of animals. I didn't like the placement of some, and to try my beginner in photoshop skills, has decided to choose and paste different animals in different layers into a NEW document. I was able to move the animals to my satisfaction, but to my dismay, when I went to print out it was half the size of the original. The size of the canvas for these two documents is 11 x 8, but I noticed when I moved the animals to the new document in Photoshop, they had already smaller air. How can I keep them original size? Help, please. Thanks in advance.

    Are the two documents of the same resolution? It seems that the second document is a higher resolution, because they are both the same size and the animals are smaller in the second paper...

Maybe you are looking for