如何让这个由jQuery驱动的页面更加流畅？

Question

我有一个联系人脚本。它使用jQuery进行ajax请求和动画。

我还使用它与hashchange插件一起来解决后退按钮问题。慢的部分在这里。

在完成“翻转”的动画后，表单会缓慢地消失。浏览器似乎会阻塞一秒钟。我正在尝试使它更加快速（无阻塞）。

以下是负责处理哈希更改事件的函数：

handleHashChange : function () {

    // Get the name of the object and cache it
    var self = this,

    // Get the current hash
        hash = window.location.hash,

    // Cache the form height var
        formHeight = '';

    // If the hash is #send or #error, don't do anything
    if (hash === "#sent" || hash === "#error") {        
        return; 
    }

    // Change the page title back to the default
    if(self.documentTitle && self.documentTitle != undefined) {
        document.title = self.documentTitle;
    }

    // Reset all inputs in the form
    self.inputs.val('').removeAttr('checked').removeAttr('selected');

    // Get the height of the form
    formHeight = self.getHeight(self.form);

    // Show the transition              
    self.showTransition(self.response, formHeight, function() {

        // Show the form
        self.form.fadeIn('fast', function() {

            // Show the button
            self.button[0].style.display = 'block';

            // Focus the first input
            self.inputs[0].focus();

        })

    })
}

整个代码可以从下面的链接中查看，它已经完全记录：

http://www.coolcontact.co.cc/beta/1.3/js/main.js

你可以看到，我在优化这个脚本时使用了很多在互联网上找到的技巧，除了使用javascript原生的'for'代替'$ .each()'，但这在这里并不是很重要。

如果有人想看到慢速，请尝试从下面的链接发送一条空消息（验证已禁用），然后单击浏览器中的后退按钮：

（注意：它不是英语，但我猜它相当容易理解^^）

http://www.coolcontact.co.cc/beta/1.3/

那我该如何使它更加流畅？

- Maher4Ever

---

我没有答案给你，但是你做了一个很好的GUI！ - Ben Fransen

我认为它已经非常迅速了！！ - Dutchie432

我同意，这里看起来非常不错。你使用的是什么浏览器？ - cambraca

如果你想用Firebug分析器，那也可以，但我同意Dutchie432的观点，它已经很快了。 - Ravindra Sane

这是一个漂亮的设计。我没有看到任何需要改变的地方。 - Jake

Answer 1

我觉得已经相当快了，但是我注意到你的代码有一个小问题。

这个 "if" 语句有点多余。

if(self.documentTitle && self.documentTitle != undefined) {
    document.title = self.documentTitle;
}

如果“self.documentTitle”的值为“undefined”，则调用将返回“false”，因此您不需要第二个“self.documentTitle！= undefined”。

您可以改用以下内容：

if(self.documentTitle){
    document.title = self.documentTitle;
}

请记住，false、null、undefined、0和空字符串的值都会被评估为false布尔值。

- Chris Pietschmann