jjzjj

javascript - HTML5 Canvas 中的一百个上下文与一个上下文?

coder 2024-07-19 原文

我正在创建一个使用 Canvas API 的简单物理引擎。性能方面的最佳实践是什么?是为 Canvas 中的每个对象(例如每个球、盒子等)创建一个单独的上下文,还是只使用一个上下文?后者涉及为每个要重绘的对象定义上下文中的路径,以及设置颜色等。

当对象数量接近一百时使用多个上下文是个坏主意吗?

我之所以问,是因为我不想在一百个工作小时后得到惊喜,因为我采用了错误的方法。

最佳答案

多 Canvas 的性能提升来自了解您使用多 Canvas 的原因

除非有用,否则不要使用多个 Canvas :

  • Canvas 是适度昂贵的元素。
  • 在移动设备上, Canvas 仍然很慢——多个 Canvas 更慢。

以下是使用多个 Canvas 的一些原因:

您有在不同时间动画的绘图。

例如,背景可能每 5 帧动画一次,而更活跃的对象可能每帧动画一次。将背景放在第二个 Canvas 上意味着您不必在每个动画帧都绘制背景。

您想“双缓冲”以提高显示速度。

例如,当当前帧正在显示时,您可能会使用第二个 Canvas 来组装一个复杂的元素,然后使用 displayContext.drawImage(bufferCanvas,0,0) 在显示 Canvas 上绘制缓冲区 Canvas 。这使您可以利用动画帧之间的“停机时间”来准备下一帧。

您使用 Canvas 对单个图像/drawnElement(模板)进行变体。

例如,如果您需要物理屏障(比如灰色建筑的图像)。你可能想要红色、蓝色和绿色的建筑来获得多样性。您可以将灰色建筑图像放在屏幕外的 Canvas 上,并使用上下文的 globalCompositeOperation 将该建筑重新着色为红色、蓝色和绿色的变体。这使您可以通过多种方式重复使用 1 个图像资源。

使用多个 Canvas 还有其他原因,但关键是使用多个 Canvas 来满足需求。

关于javascript - HTML5 Canvas 中的一百个上下文与一个上下文?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18682130/

有关javascript - HTML5 Canvas 中的一百个上下文与一个上下文?的更多相关文章

  1. ruby - 在 Ruby 中,在类方法的上下文中,什么是实例变量和类变量? - 2

    如果我有以下一段Ruby代码:classBlahdefself.bleh@blih="Hello"@@bloh="World"endend@blih和@@bloh到底是什么?@blih是Blah类中的一个实例变量,@@bloh是Blah类中的一个类变量,对吗?这是否意味着@@bloh是Blah的类Class中的一个变量? 最佳答案 人们似乎忽略了该方法是类方法。@blih将是常量Bleh的类Class实例的实例变量。因此:irb(main):001:0>classBlehirb(main):002:1>defself.blehirb

  2. ruby-on-rails - 使用 javascript 更改数据方法不会更改 ajax 调用用户的什么方法? - 2

    我遇到了一个非常奇怪的问题,我很难解决。在我看来,我有一个与data-remote="true"和data-method="delete"的链接。当我单击该链接时,我可以看到对我的Rails服务器的DELETE请求。返回的JS代码会更改此链接的属性,其中包括href和data-method。再次单击此链接后,我的服务器收到了对新href的请求,但使用的是旧的data-method,即使我已将其从DELETE到POST(它仍然发送一个DELETE请求)。但是,如果我刷新页面,HTML与"new"HTML相同(随返回的JS发生变化),但它实际上发送了正确的请求类型。这就是这个问题令我困惑的

  3. ruby - 在 Ruby 中的另一个上下文中评估潜在的相对 URI - 2

    我在Ruby程序中有两个URI。一个肯定是绝对URI,另一个可能是绝对URI或相对URI。我想在第一个的上下文中将第二个转换为绝对URI,所以如果第一个是http://pupeno.com/blog第二个是/about,结果应该是http://pupeno.com/about.有什么想法吗? 最佳答案 Ruby的内置URI和Addressablegem,做这个简短的工作。我更喜欢Addressable,因为它功能更全面,但URI是内置的。require'uri'URI.join('http://pupeno.com/blog','/

  4. ruby - 在 Mechanize 中使用 JavaScript 单击链接 - 2

    我有这个:AccountSummary我想单击该链接,但在使用link_to时出现错误。我试过:bot.click(page.link_with(:href=>/menu_home/))bot.click(page.link_with(:class=>'top_level_active'))bot.click(page.link_with(:href=>/AccountSummary/))我得到的错误是:NoMethodError:nil:NilClass的未定义方法“[]” 最佳答案 那是一个javascript链接。Mechan

  5. Ruby 将上下文分配给 lambda? - 2

    是否可以不为lambda分配上下文?例如:classRuledefget_rulereturnlambda{putsname}endendclassPersonattr_accessor:namedefinit_rule@name="ruby"Rule.new.get_rule.call()#shouldsay"ruby"butsaywhatobjectofclassRull,doesnothavevariablename#orself.instance_eval&Rule.new.get_ruleendend我的目标是->没有上下文的存储过程对象,并在特定位置调用之前分配上下文。可能

  6. javascript - jQuery 的 jquery-1.10.2.min.map 正在触发 404(未找到) - 2

    我看到有关未找到文件min.map的错误消息:GETjQuery'sjquery-1.10.2.min.mapistriggeringa404(NotFound)截图这是从哪里来的? 最佳答案 如果ChromeDevTools报告.map文件的404(可能是jquery-1.10.2.min.map、jquery.min.map或jquery-2.0.3.min.map,但任何事情都可能发生)首先要知道的是,这仅在使用DevTools时才会请求。您的用户不会遇到此404。现在您可以修复此问题或禁用sourcemap功能。修复:获取文

  7. ruby-on-rails - 我将 Rails3 与 tinymce 一起使用。如何呈现用户关闭浏览器javascript然后输入xss? - 2

    我有一个用Rails3编写的站点。我的帖子模型有一个名为“内容”的文本列。在帖子面板中,html表单使用tinymce将“content”列设置为textarea字段。在首页,因为使用了tinymce,post.html.erb的代码需要用这样的原始方法来实现。.好的,现在如果我关闭浏览器javascript,这个文本区域可以在没有tinymce的情况下输入,也许用户会输入任何xss,比如alert('xss');.我的前台会显示那个警告框。我尝试sanitize(@post.content)在posts_controller中,但sanitize方法将相互过滤tinymce样式。例如

  8. ruby - 从上面的上下文返回 - 2

    这个问题的表述并不复杂,但我会尽力而为。通过我们的代码,我们有一些片段,例如response=do_something()returnresponseunlessresponse.ok?我想写一个包装器方法,这样就不需要这一步了,它看起来像这样defrr(&block)response=yieldunlessresponse.ok?#somehowdoreturnbutincontextabove(magicneededhere)endresponseend之后我就可以将上面的代码最小化为response=rr{do_something()}似乎不可能,但这是Ruby所以也许有办法吗?

  9. ruby - 调用 instance_eval(&lambda) 传递当前上下文时出现错误 'wrong number of arguments' - 2

    要清楚-此代码运行完美-codewithproc但如果我将Proc.new更改为lambda,则会出现错误ArgumentError:wrongnumberofarguments(1for0)这可能是因为instance_eval想要将self作为参数传递,而lambda将其视为一种方法并且不接受未知参数?有两个例子-第一个是工作:classRuledefget_ruleProc.new{putsname}endendclassPersonattr_accessor:namedefinit_rule@name="ruby"instance_eval(&Rule.new.get_rule

  10. ruby - 使用 Selenium WebDriver 启用/禁用 javascript - 2

    出于某种原因,我必须为Firefox禁用javascript(手动,我们按照提到的步骤执行http://support.mozilla.org/en-US/kb/javascript-settings-for-interactive-web-pages#w_enabling-and-disabling-javascript)。使用Ruby的SeleniumWebDriver如何实现这一点? 最佳答案 是的,这是可能的。而是另一种方式。您首先需要查看链接Selenium::WebDriver::Firefox::Profile#[]=

随机推荐