`

JavaScript 和 Ajax 开发的最佳实践

阅读更多
    使用外部 JavaScript 文件
最大化 JavaScript 应用程序的金科玉律是尽可能使用外部 JavaScript 文件,而不是直接将 JavaScript 代码包含在 HTML 文件中。这么做不仅仅意味着不用在多个文件之间复制 JavaScript 代码,而且 JavaScript 代码会被 web 浏览器缓存,不必在每个子页面加载时重复加载一遍。第一个页面加载时特别慢,因为外部文件需要发送额外的 HTTP 请求到服务器。尽管如此,大多数应用程序中,第一次加载损失的性能远比子页面加载节省下的性能小得多。
  
   脚本放置和加载
当您阅读 HTML 书籍时,它很可能建议您将 <script> 标记放在页面的 <head> 元素内部。如果这就是您目前对 <script> 标记放置的认识,赶紧把它忘了吧!将 <script> 标记放在 HTML 页面顶部将会使页面直到 JavaScript 代码完全加载和执行后才能呈现。如果将它们放在 <head> 标记内部,只有到脚本加载并执行后,页面主体才会呈现,从而让用户觉得页面加载很慢。
为了最优化页面的性能,应该将 JavaScript 代码放在页面底部,如果可能,就在 </body> 标记之前。这样,web 页面其他部分(HTML、CSS、图片、Flash 内容等等)将会在脚本加载和执行前下载,从而会让用户觉得加载要快一些。
如果您的 web 页面或应用程序需要很多 JavaScript,将所有代码放在一个单独文件中可能会造成下载和执行时长时间等待。这些情况下,最好将 JavaScript 代码分别放到多个文件中,当页面加载完成后在需要时动态加载。LazyLoad JavaScript 库旨在提供动态脚本加载,并考虑到有关脚本执行顺序在跨浏览器时的不一致性。
分享到:
评论

相关推荐

    Ajax模式与最佳实践英文原版

    这本《Ajax模式与最佳实践》的英文原版深入探讨了Ajax技术的核心概念、应用场景以及最佳实践,对于想要深入了解和掌握Ajax的开发者来说是一份宝贵的资源。 Ajax的核心在于异步通信,它允许网页后台与服务器进行数据...

    ajax和js的web开发

    `AJAX开发简略.pdf`则可能是介绍Ajax开发的教程,可能包含了Ajax的基本概念、使用场景、最佳实践,以及如何利用JavaScript实现Ajax请求等。这份资料可能帮助开发者快速上手Ajax开发,理解如何创建异步请求,如何处理...

    Ajax模式最佳实践(英文版)

    JSON(JavaScript Object Notation)因其轻量级、易于解析的特点,在Ajax开发中得到了广泛的应用。XML虽然功能强大,但在Ajax环境下,其解析复杂度和体积通常比JSON更大,因此除非特定需求,否则推荐使用JSON作为...

    《JAVASCRIPT语言精髓与编程实践》.周爱民PDF

    7. **ES6及以后的版本更新**:书中也会涉及ECMAScript 6及其后续版本的新特性和最佳实践,如箭头函数、模板字符串、类、模块系统等,这些都是现代JavaScript开发不可或缺的知识。 8. **编程实践**:除了理论知识,...

    JavaScript典型应用与最佳实践

    JavaScript,作为全球最广泛...通过深入学习以上知识点,并结合实践中的最佳实践,开发者能够编写出高质量的JavaScript代码,提升Web应用的用户体验和性能。不断探索和学习新的库、框架和技术,是保持与时俱进的关键。

    JavaScript典型应用与最佳实践-源代码

    以下将详细讨论JavaScript的一些关键知识点和最佳实践。 1. **变量声明与数据类型**: JavaScript中的变量使用`var`, `let`, 或 `const`进行声明。`var`的作用域是函数,而`let`和`const`在ES6中引入,具有块级...

    ajax设计模式与最佳实践

    **Ajax设计模式与最佳实践** Ajax(Asynchronous JavaScript and XML)技术自2005年以来在Web开发领域引起了革命性的变革,它使得...无论你是初学者还是经验丰富的开发者,都能从中受益匪浅,提升你的Ajax开发技能。

    2010年北风网CJ讲师JavaScript_Ajax_jQuery视频教程下载地址

    对于有一定经验的开发者来说,这个教程也可以作为复习和提升技能的参考资料,特别是在jQuery的高级特性和最佳实践方面。 在学习过程中,配合教程提供的文本资料《2010年北风网CJ讲师JavaScript+Ajax+jQuery视频教程...

    Ajax开发精要原码

    4. **Ajax最佳实践** - **减少HTTP请求**:合并CSS和JS文件,使用图片精灵等技术降低请求次数。 - **缓存利用**:通过HTTP头设置缓存,避免不必要的重复请求。 - **进度指示**:显示加载状态,让用户知道请求正在...

    ajax_json的开发包

    这些资源可能涵盖如何创建Ajax请求,如何处理JSON数据,以及在各种场景下应用Ajax和JSON的最佳实践。对于初学者或正在开发需要动态数据加载功能的Web应用的开发者来说,这是一个非常有价值的资源。 总的来说,Ajax...

    ajax学习开发手册

    6. **Ajax的最佳实践**: - **局部刷新**:如何有效地更新DOM,避免不必要的重绘和回流。 - **错误处理**:建立良好的错误处理机制,包括异常捕获和反馈给用户。 - **性能优化**:利用缓存,减少HTTP请求,预加载...

    ajax设计模式与最佳实践.pdf

    通过对AJAX设计模式与最佳实践的学习,开发人员能够更好地构建高效、安全的Web应用。在未来的发展中,随着新技术如WebSockets的出现,AJAX仍然会是Web开发中的一个重要组成部分。 以上内容综合了给定的文件标题、...

    WEB前端开发最佳实践.docx

    WEB前端开发最佳实践涉及到的技术广泛且深入,从基础的HTML5和CSS3布局,到JavaScript的高级应用,再到Vue.js等现代框架的实战,都需要开发者持续学习和实践。通过系统的培训,学员不仅可以掌握前沿的开发技能,还能...

    2008新书_JavaScript and Ajax Tools for Great Web Experiences

    《2008新书_JavaScript and Ajax Tools for Great Web Experiences》一书...通过阅读本书,开发者不仅能掌握创建卓越网络体验所需的技术,还能深入了解这些技术背后的原理和最佳实践,为自己的职业发展奠定坚实的基础。

Global site tag (gtag.js) - Google Analytics