最近，我需要在 Canvas 上绘制许多图像。 Canvas 大小是800x600px，我有很多256x256px的图片(有些小)可以在上面画，这些小图会在 Canvas 上组成一个完整的图像。我有两种方法来实现这个。
首先，如果我使用 Canvas 2D 上下文，即 context = canvas.getContext('2d')，那么我可以只使用 context.drawimage() 方法将每个图像放在 Canvas 的正确位置。
另一种方式，我使用 WebGL 在 Canvas 上绘制这些图像。这样，对于每个小图像，我都需要绘制一个矩形。矩形的大小与这个小图像相同。此外，矩形位于 Canvas 的正确位置。然后我使用图像作为纹理来填充它。
然后，我比较了这两种方法的性能。两者的fps都会达到60，而且动画(当我用鼠标点击或移动时， Canvas 会重绘很多次)看起来非常流畅。所以我比较了他们的 CPU 使用率。我希望当我使用 WebGL 时，CPU 会使用更少，因为 GPU 将保证许多绘图工作。但结果是，CPU 使用率看起来几乎相同。我尝试优化我的 WebGL 代码，我认为它已经足够好了。通过google，发现Chrome、Firefox等浏览器默认会开启硬件加速。所以我尝试关闭硬件加速。那么第一种方法的CPU使用率就高了很多。所以，我的问题是，既然canvas 2D使用GPU加速，我是否有必要只使用WebGL来进行2D渲染？ Canvas 2D GPU 加速和 WebGL 有什么不同？他们都使用 GPU。也许还有其他方法可以降低第二种方法的 CPU 使用率？任何答案将不胜感激!
最佳答案
Canvas 2D 仍然比 WebGL 支持更多的地方，所以如果您不需要任何其他功能，那么使用 Canvas 2D 意味着您的页面将在那些有 Canvas 但没有 WebGL 的浏览器(如旧的 android 设备)上工作。当然，它在这些设备上会很慢，并且可能会因其他原因而失败，例如如果您有大量图像，内存不足。
理论上 WebGL 可以更快，因为 canvas 2d 的默认设置是保留绘图缓冲区，而对于 WebGL 则不是。这意味着如果您在 WebGL 上关闭抗锯齿功能，浏览器可以选择双倍缓冲。它不能用 canvas2d 做的事情。另一个优化是在 WebGL 中，您可以关闭 alpha，这意味着浏览器可以选择在将 WebGL 与页面合成时关闭混合，这同样是 canvas 2d 没有的选项。 (有计划能够关闭 canvas 2d 的 alpha，但截至 2017/6，它还没有得到广泛支持)
但是，选项 我的意思就是这样。由浏览器决定是否进行这些优化。
否则，如果您不选择这些优化，则 2 种速度可能相同。我个人还没有发现这种情况。我尝试只用 canvas 2d 做一些 drawImage 的事情，但没有像我用 WebGL 那样获得平滑的帧率。这是没有意义的，但我假设浏览器内部发生了一些我没有意识到的事情。
我想这带来了最后的区别。 WebGL 是低级的并且是众所周知的。浏览器无法将其搞砸。或者换句话说，您可以 100% 掌控一切。
另一方面，使用 Canvas2D 取决于浏览器要做什么以及要进行哪些优化。它们可能会在每个版本中发生变化。我知道对于 Chrome 来说，256x256 以下的任何 Canvas 都没有硬件加速。另一个例子是 Canvas 在绘制图像时的作用。在 WebGL 中，您制作纹理。您决定着色器的复杂程度。在 Canvas 中你不知道它在做什么。也许它正在使用支持所有各种 Canvas globalCompositeOperation、 mask 和其他功能的复杂着色器。也许为了内存管理，它将图像分成多个 block 并将它们渲染成碎片。对于每个浏览器以及同一浏览器的每个版本，它决定做什么取决于该团队，而对于 WebGL，它几乎 100% 取决于您。他们无法在中间搞砸 WebGL。
仅供引用:这是 an article detailing how to write a WebGL version of the canvas2d drawImage function然后是 an article on how to implement the canvas2d matrix stack .
关于javascript - WebGL VS Canvas 二维硬件加速，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/36908427/
我遇到了一个非常奇怪的问题，我很难解决。在我看来，我有一个与data-remote="true"和data-method="delete"的链接。当我单击该链接时，我可以看到对我的Rails服务器的DELETE请求。返回的JS代码会更改此链接的属性，其中包括href和data-method。再次单击此链接后，我的服务器收到了对新href的请求，但使用的是旧的data-method，即使我已将其从DELETE到POST(它仍然发送一个DELETE请求)。但是，如果我刷新页面，HTML与"new"HTML相同(随返回的JS发生变化)，但它实际上发送了正确的请求类型。这就是这个问题令我困惑的
我正在处理http://prepwork.appacademy.io/mini-curriculum/array/中概述的数组问题我正在尝试创建函数my_transpose，它接受一个矩阵并返回其转置。我对写入二维数组感到很困惑!这是一个代码片段，突出了我的困惑。rows=[[0,1,2],[3,4,5],[6,7,8]]columns=Array.new(3,Array.new(3))putscolumns.to_s#Outputisa3x3arrayfilledwithnilcolumns[0][0]=0putscolumns.to_s#Outputis[[0,nil,nil],[
我有这个: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
技术选型1，前端小程序原生MINA框架cssJavaScriptWxml2，管理后台云开发Cms内容管理系统web网页3，数据后台小程序云开发云函数云开发数据库（基于MongoDB）云存储4，人脸识别算法基于百度智能云实现人脸识别一，用户端效果图预览老规矩我们先来看效果图，如果效果图符合你的需求，就继续往下看，如果不符合你的需求，可以跳过。1-1，登录注册页可以看到登录页有注册入口，注册页如下我们的注册，需要管理员审核，审核通过后才可以正常登录使用小程序1-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功能。修复:获取文
我想在rubyonrails中生成QR码，以便在我用rails编写的网站后台运行。看到这个http://code.google.com/p/qrcode-rails/但无法弄清楚如何让它为我工作。基本上在RoR中，我想:向生成器传递一个字符串、我的唯一代码、一个20个字符长度的数字(例如32032928889998887776)并生成一个名为“代码”_qr.jpg的图像并保存在资源文件夹中以附加到我的电子邮件中程序将发出。我该怎么做，有人知道吗？虽然我在问(不是很重要，我现在得到这个答案)但是我如何实现QR码读取，以从网络摄像头取回该代码？谢谢。 最佳答
我有一个用Rails3编写的站点。我的帖子模型有一个名为“内容”的文本列。在帖子面板中，html表单使用tinymce将“content”列设置为textarea字段。在首页，因为使用了tinymce，post.html.erb的代码需要用这样的原始方法来实现。.好的，现在如果我关闭浏览器javascript，这个文本区域可以在没有tinymce的情况下输入，也许用户会输入任何xss，比如alert('xss');.我的前台会显示那个警告框。我尝试sanitize(@post.content)在posts_controller中，但sanitize方法将相互过滤tinymce样式。例如
我有33个规范以大约5秒的速度运行，以这种速度运行会导致测试套件变慢。我追踪到请求规范(4秒以上)，因为模型规范只用了一小部分时间。我已经检查过，我的请求规范没有任何过于复杂或不必要的东西，所以我不知道该去哪里让它们更快，而不是只在推送代码之前运行它们以确保一切正常.加快请求规范的最佳方法是什么？ 最佳答案 我使用Spork来加速我的测试。它保持整个环境加载以赢得时间。看看这个博客:http://ykyuen.wordpress.com/2010/12/14/rails-running-rspec-with-spork-test-s
出于某种原因，我必须为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#[]=
我是Ruby和Watir-Webdriver的新手。我有一套用VBScript编写的站点自动化程序，我想将其转换为Ruby/Watir，因为我现在必须支持Firefox。我发现我真的很喜欢Ruby，而且我正在研究Watir，但我已经花了一周时间试图让Webdriver显示我的登录屏幕。该站点以带有“我同意”区域的“警告屏幕”开头。用户点击我同意并显示登录屏幕。我需要单击该区域以显示登录屏幕(这是同一页面，实际上是一个表单，只是隐藏了)。我整天都在用VBScript这样做:objExplorer.Document.GetElementsByTagName("area")(0).click
