Tag: performance

更快的JavaScript处理

刚问了我的第一个问题并得到了很好的回应。 非常有帮助。 帮我创建了这个javascript，在同一页面上创建了两个随机数。 window.onload = function(){ generateRandomNumber1(); generateRandomNumber2(); } function generateRandomNumber1(){ var n = 30; var number = Math.floor(Math.random()*n)+1; document.getElementById(“random1”).innerHTML = number; } function generateRandomNumber2(){ var n = 15; var number = Math.floor(Math.random()*n)+1; document.getElementById(“random2”).innerHTML = number; } A也使用这段脚本来显示延时的两个div： var toggle = function() { $(“#loadingContainer1”).show(); } setTimeout(toggle, 1000); var toggle = function() { $(“#loadingContainer1”).hide(); } setTimeout(toggle, […]

jQuery切换焦点/模糊的兄弟姐妹

所以我现在有这个并且它有效，但是我想知道在编写移动网站时是否有最佳的写作方式，如果有重要的话，还有性能。 想想在元素下滑下（切换）的工具提示，我在页面上也有大约30个工具提示div，因为这将用于多个元素 JS： $(‘.mobile-tool-tip’).each(function() { $(this).hide(); $(this).prev().focus(function() { $(this).next().slideToggle(‘fast’); }); $(this).prev().blur(function() { $(this).next().slideToggle(‘fast’); }); }); HTML for mobile-tool-tipfunction Valid format 999-999-9999. Please include the area code. 一直在使用这个（感谢亨特 ）切换元素，但不能让它与下一个（）工作，我不想用手编写每个工具提示div $(“[name=field_name]”).change(function() { var show = $(this).val(); $(“#hidden_div”).toggle(show); });

jQuery中最接近IE的行为非常慢

我有一个5000行的表。 在每一行中我都有一个html元素。 myElementList是这些元素的列表。 现在我需要选择这些元素的所有tr。 我使用以下代码。 myElementList.closest(‘tr’); 这项工作在FF很棒。 但是，当我在IE 8中运行相同时。浏览器挂起并出现一个弹出式杂乱的东西，用于停止脚本。 任何建议，为什么我看到这种行为或他们是任何替代。 编辑 ： 当我使用parents（）时，行为保持不变 myElementList.parents(‘tr’);

jQuery – 当点击元素太快时，动画就会出错

我一直在研究这个jQuery效果inheritance人的小提琴： http ： //jsfiddle.net/abtPH/26/ 到目前为止，一切都很不错，但是当我点击元素太快时，它似乎变得越来越怪并且变得奇怪。 如果你花时间点击元素就可以了。 我尝试过使用:animate 在用户点击下一个动画之前确保动画结束的东西。 我不喜欢这种方法，因为从最终用户来看，效果似乎是滞后的。 我希望用户能够快速点击元素并获得所需的效果。 到目前为止，这是我的jQuery： $(‘li’).on(‘click’, function (e) { e.preventDefault(); var active = $(this).siblings(‘.active’); var posTop = ($(this).position()).top; if (active.length > 0) { var activeTop = (active.position()).top; if (activeTop == posTop) { $(this).find(‘.outer’).fadeIn(‘medium’, function () { active.toggleClass(‘active’, 400).find(‘.outer’).fadeOut(‘medium’); }); } else { $(this).siblings(‘.active’).toggleClass(‘active’, 400).find(‘.outer’).slideToggle(); $(this).find(‘.outer’).slideToggle(); } } else { […]

IE中的表的jQuery UI性能问题

我在获取UI代码以便在IE中执行时遇到了问题。 我有一张桌子 – 价值矩阵。 每个单元格可以为空或包含项目列表。 我希望用户能够在单元格之间拖动项目。 所以我的HTML看起来像这样： col 1col 2 row 1 item A item B row 2 item C item D 然后我使用jQuery 1.3.1和jQuery UI 1.6rc6： $j(‘.draggable-item’).each(function() { $j(this).draggable({ addClasses: false, revert: true, zIndex: 2000, cursor: ‘move’ }); }); $j(‘.droppable-cell’).each(function() { $j(this).droppable({ addClasses: false, activeClass: ‘droppable-cell-candrop’, hoverClass: ‘droppable-cell-hover’, tolerance: ‘pointer’, drop: function(event, ui) { //function […]

如何在多个fabric js canvas的情况下管理内存？

在我的应用程序中，我有多个Fabric.jscanvas，canvas数量没有限制。 我将通过Fabric.js的loadFromJson方法渲染重JSON。 因此，如果canvas未使用，我想释放结构对象内存。 我怎样才能做到这一点？ 一次只能看到一个canvas。 但是我必须在页面加载时渲染所有canvas。 Canvas实际上是一个页面，用户可以通过单击页码或其他内容在页面之间切换。 记住用户可以随时回到任何canvas并尝试涂鸦或使用任何其他Fabric.jsfunction。 这是我的HTML结构： .fabricCanvas { border: 1px solid green; margin: 5px; } .canvas-container { margin: 5px; } 我的JS代码来存储结构实例 var canvasInstances = []; $(‘canvas.fabricCanvas’).each(function () { var fabricCanvasObj = new fabric.Canvas(this, { isDrawingMode: true }); canvasInstances.push(fabricCanvasObj); fabricCanvasObj.renderAll(); }); console.log(canvasInstances[0]); 我正在存储实例，以便我以后可以使用它们。 我想要更好的内存管理，基本上在需要时加载和卸载实例。 示例情况DEMO就在这里。 在本演示中，考虑使用z-index将canvas相互覆盖，但它们是DOM的一部分，并且已经在页面加载时呈现。 如有任何疑问，请告诉我，我可以进一步解释。 什么时候有超过5幅canvasiPad浏览器崩溃，我认为是内存问题。

jQuery UI datepicker性能

我的网页上有一个用于指定日期的文本框，所以我想使用jQuery DatePicker 。 但是，我的大多数用户都被锁定使用IE6，并且jQuery DatePicker的性能在这个浏览器中有点迟钝。 任何人都可以推荐一个替代的JavaScript日期选择器，或任何提高jQuery DatePicker的显示性能的方法吗？

$（document）.ready（）检查是否会降低IE的速度？

我一直在与一家名为Catchpoint的公司合作，以解决客户端代码指标中的一些不一致问题。 他们有一些事件可以触发，它们可以衡量页面加载过程中的里程碑。 他们为我们提供的指标是在IE8中。 现在，他们声称JQuery在IE中确定DOM准备的方式实际上会严重损害页面性能，我们应该不惜一切代价避免它。 我知道JQuery使用doScrollCheck()方法和documentElement上的1ms递归setTimeout blast做了什么，我发现他们可能有一个有效的声明。 他们说每个$(document).ready()块的性能都会成倍地$(document).ready() 。 我的问题是，他们是否有任何统计数据来validation这种说法，如果是这样，我将如何实现一个IE友好的解决方案，而无需为我的需求重新编写JQuery源代码。

如何在不损害网站页面速度的情况下在我的网站上使用谷歌字体

我使用谷歌字体和我的网站的排版。 看起来很棒，但它增加了很大的开销。 有没有办法在不影响网站速度的情况下仍能为我的网站获得相同的外观和感觉？ 我在这里分析我的网站https://developers.google.com/speed/pagespeed ，当我使用谷歌字体时，我得到的分数非常低，大约60分，但如果我删除这些字体，那么我的分数很高。 有没有办法在不影响网页质量的情况下使用这些字体？ 我的首要任务是页面优化。

IE8上的鼠标hover/hover效果很慢

我在IE8中发现了一个奇怪的性能问题，当在一个有很多行的表上使用鼠标hover事件时（本例中为100）。 我已经尝试了很多不同的方法，但我似乎无法找到任何方法来获得它我喜欢/需要的速度。 如果我在每个事件上切换类，性能在所有IE版本中都会下降，如果我通过javascript使用CSS直接操作IE6和IE7加速很多，但IE8仍然执行糟糕。 有任何想法吗 ？ 我真的想知道是什么让mouseover事件与其他所有浏览器相比都显得迟钝。 如果这只发生在IE6上，我可以理解并让它通过，但是当最新版本的浏览器是最慢的时，只会有越来越多的用户体验不好。 使用JQueryhover的示例： http ： //thedungheap.net/research/ 编辑：我现在更新了示例，以便很容易看到有10行和200之间的区别。这是在同一个文档中，所以这对整个DOM大小来说不是问题，我猜