Heim Web-Frontend js-Tutorial JS代码优化技巧之通俗版(减少js体积)_javascript技巧

JS代码优化技巧之通俗版(减少js体积)_javascript技巧

May 16, 2016 pm 05:57 PM
代码优化

细读完这篇文章,够你优化大半天的了,关于JS优化方法大都脱离不了这三种方法。

JS代码优化技巧之通俗版

(网页总大小为155.k,而JS就占了100.3K)

是时候优化下JS了

关于JS优化的文章已经很多了,大多技术性很强,像什么变量、字符串、类型,就不做介绍了,也不需要介绍,我也不懂,你知道了也没用。大多数站长都是“拿来主义”,我只需要告诉JS怎么放,删那里就可以了。

现在的网站都加的有统计代码、分享工具、评论列表、相关文章插件等工具,而要实现强大的功能,必须使用JS文件,正是这些JS插件,再增强了网站功能的同时,也给影响了网站速度。

最常用的JS优化办法

通过博客调用JS来看,目前最影响速度的为无觅插件(952ms),拿福能广告(434ms)。如果确实要用可以保留,适当的根据官方教材做做优化,下面卢松松介绍几个最常用的JS优化方法。

方法一:把不重要的JS放在页面最底部

这是最简单,也是效果最好的优化方法,把不重要的JS通通放到页面的最下面body的上面,实现异步加载,也就是等网页都加载完了,最后在加载这些不重要的JS,这样就不影响网页速度了。

如低调与华丽模板中公共的util.js公共文件,默认效果为,浏览网页时会在网页中出现“回顶部、写评论”特效。现在把wumii(无觅插件JS)和jiathis(分享工具JS)统一整合到util.js文件中了。

JS代码优化技巧之通俗版

(不重要的JS都放到页面最底部了)

当然,其他网站也需要这样做:把不重要的JS通通放到页面最底部。

方法二:合并JS文件

合并JS,也就是减少HTTP请求,少给服务器请求一次就加快一点速度,而合并两个原本独立的JS就需要点技术了,但这难不倒我们,告诉大家一个最简单的方法:

不管三七二十一,先把A文件直接粘贴到B文件中,合并后删除网页中的A文件,如果网页运行正常,就OK;如果一些特效失效,那就还原,换C文件合并。总会有两个不冲突的JS文件的。

例如我博客上的百度广告管家,有6个广告位,默认情况是要进行6次HTTP请求的,因为是第三方JS,一次请求最快要花234ms,而6次请求就就需要花2秒,也就是说因为这个广告管家打开网页就要额外增加2秒。

JS代码优化技巧之通俗版

(第二段JS就是把6个请求变成了1个)

按照官方教程把JS合并后,6个广告位的广告请求合并为1次请求,大幅降低js请求次数,有效减少页面渲染被阻塞的情况,提升广告加载速度。

方法三:给JS文件减肥

咱不讨论什么三目运算符、减少对象查找、如何让JS简洁,咱就用“JS减肥工具”。通常这类工具会把JS文件中几百行的代码压缩成一行,使体积变小。推荐工具:http://javascriptcompressor.com/软件版本(容错效果好)

因为空行等问题,有时候使用这类工具会使JS功能失效,而最简单的办法是用Dreamweaver,把压缩后的JS放入DW中,DW会自动提示你那里有误,把错误的地方另起一行,或还原回去即可。

最后再给个网友的现身说法吧:

JS代码优化技巧之通俗版

当你的站点随着时间的推移慢慢地做大的时候,你就会发现很多问题出来的,其中一个就是越来越臃肿庞大,因此运行的速度也就会慢了下来。优化,尽力去优化站点,就变得非常重要了。

这些方法都通俗易懂,希望对大家有用!

Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Heiße KI -Werkzeuge

Undresser.AI Undress

Undresser.AI Undress

KI-gestützte App zum Erstellen realistischer Aktfotos

AI Clothes Remover

AI Clothes Remover

Online-KI-Tool zum Entfernen von Kleidung aus Fotos.

Undress AI Tool

Undress AI Tool

Ausziehbilder kostenlos

Clothoff.io

Clothoff.io

KI-Kleiderentferner

AI Hentai Generator

AI Hentai Generator

Erstellen Sie kostenlos Ai Hentai.

Heißer Artikel

R.E.P.O. Energiekristalle erklärten und was sie tun (gelber Kristall)
2 Wochen vor By 尊渡假赌尊渡假赌尊渡假赌
Repo: Wie man Teamkollegen wiederbelebt
4 Wochen vor By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island Abenteuer: Wie man riesige Samen bekommt
4 Wochen vor By 尊渡假赌尊渡假赌尊渡假赌

Heiße Werkzeuge

Notepad++7.3.1

Notepad++7.3.1

Einfach zu bedienender und kostenloser Code-Editor

SublimeText3 chinesische Version

SublimeText3 chinesische Version

Chinesische Version, sehr einfach zu bedienen

Senden Sie Studio 13.0.1

Senden Sie Studio 13.0.1

Leistungsstarke integrierte PHP-Entwicklungsumgebung

Dreamweaver CS6

Dreamweaver CS6

Visuelle Webentwicklungstools

SublimeText3 Mac-Version

SublimeText3 Mac-Version

Codebearbeitungssoftware auf Gottesniveau (SublimeText3)

Wie man Java-Code gut umgestaltet Wie man Java-Code gut umgestaltet Jun 15, 2023 pm 09:17 PM

Als eine der beliebtesten Programmiersprachen der Welt ist Java für viele Unternehmen und Entwickler zur Sprache der Wahl geworden. Allerdings ist Code-Refactoring für die Aufrechterhaltung der Codequalität und Entwicklungseffizienz von entscheidender Bedeutung. Aufgrund seiner Komplexität kann es mit der Zeit immer schwieriger werden, Java-Code zu warten. In diesem Artikel wird erläutert, wie Sie Java-Code umgestalten, um die Codequalität und Wartbarkeit zu verbessern. Verstehen Sie die Prinzipien des Refactorings. Der Zweck des Java-Code-Refactorings besteht darin, die Struktur, Lesbarkeit und Wartbarkeit des Codes zu verbessern, und nicht einfach nur „den Code zu ändern“. Weil

Leistungsoptimierung von Java Spring Boot Security: Bringen Sie Ihr System zum Fliegen Leistungsoptimierung von Java Spring Boot Security: Bringen Sie Ihr System zum Fliegen Feb 19, 2024 pm 05:27 PM

1. Codeoptimierung, um die Verwendung zu vieler Sicherheitsanmerkungen zu vermeiden: Versuchen Sie in Controller und Service, die Verwendung von @PreAuthorize und @PostAuthorize sowie anderen Anmerkungen zu reduzieren, um die Ausführungszeit des Codes zu verlängern. Abfrageanweisungen optimieren: Bei Verwendung von springDataJPA kann die Optimierung von Abfrageanweisungen die Datenbankabfragezeit verkürzen und dadurch die Systemleistung verbessern. Sicherheitsinformationen zwischenspeichern: Durch das Zwischenspeichern einiger häufig verwendeter Sicherheitsinformationen kann die Anzahl der Datenbankzugriffe verringert und die Reaktionsgeschwindigkeit des Systems verbessert werden. 2. Verwenden Sie Indizes zur Datenbankoptimierung: Durch das Erstellen von Indizes für häufig abgefragte Tabellen kann die Abfragegeschwindigkeit der Datenbank erheblich verbessert werden. Protokolle und temporäre Tabellen regelmäßig bereinigen: Protokolle und temporäre Tabellen regelmäßig bereinigen

Codeoptimierungstechniken in der PHP-Verarbeitung mit hoher Parallelität Codeoptimierungstechniken in der PHP-Verarbeitung mit hoher Parallelität Aug 11, 2023 pm 12:57 PM

Codeoptimierungstechniken in der PHP-Verarbeitung mit hoher Parallelität Mit der rasanten Entwicklung des Internets ist die Verarbeitung mit hoher Parallelität zu einem wichtigen Thema bei der Entwicklung von Webanwendungen geworden. In der PHP-Entwicklung ist die Optimierung des Codes zur Bewältigung hoher gleichzeitiger Anforderungen zu einem schwierigen Problem geworden, das Programmierer lösen müssen. In diesem Artikel werden einige Codeoptimierungstechniken in der PHP-Verarbeitung mit hoher Parallelität vorgestellt und Codebeispiele zur Veranschaulichung hinzugefügt. Angemessene Verwendung des Caches. In Situationen mit hoher Parallelität führt ein häufiger Zugriff auf die Datenbank zu einer übermäßigen Systemlast und einem relativ langsamen Zugriff auf die Datenbank. Deshalb können wir

Was sind die gängigen Methoden zur Optimierung der Programmleistung? Was sind die gängigen Methoden zur Optimierung der Programmleistung? May 09, 2024 am 09:57 AM

Zu den Methoden zur Programmleistungsoptimierung gehören: Algorithmusoptimierung: Wählen Sie einen Algorithmus mit geringerer Zeitkomplexität und reduzieren Sie Schleifen und bedingte Anweisungen. Auswahl der Datenstruktur: Wählen Sie geeignete Datenstrukturen basierend auf Datenzugriffsmustern aus, z. B. Nachschlagebäume und Hash-Tabellen. Speicheroptimierung: Vermeiden Sie die Erstellung unnötiger Objekte, geben Sie nicht mehr verwendeten Speicher frei und verwenden Sie die Speicherpooltechnologie. Thread-Optimierung: Identifizieren Sie Aufgaben, die parallelisiert werden können, und optimieren Sie den Thread-Synchronisierungsmechanismus. Datenbankoptimierung: Erstellen Sie Indizes, um den Datenabruf zu beschleunigen, optimieren Sie Abfrageanweisungen und verwenden Sie Cache- oder NoSQL-Datenbanken, um die Leistung zu verbessern.

So überarbeiten Sie Code in der Go-Sprache So überarbeiten Sie Code in der Go-Sprache Jun 02, 2023 am 08:31 AM

Mit der kontinuierlichen Vertiefung der Softwareentwicklung und der kontinuierlichen Anhäufung von Code ist Code-Refactoring zu einem unvermeidlichen Bestandteil des modernen Softwareentwicklungsprozesses geworden. Dabei handelt es sich um einen Prozess, bei dem der etablierte Code eines Systems geändert wird, um dessen Struktur, Leistung, Lesbarkeit oder andere damit zusammenhängende Aspekte zu verbessern. In diesem Artikel werden wir untersuchen, wie man Code-Refactoring in der Go-Sprache durchführt. Refactoring-Ziele definieren Bevor wir mit dem Code-Refactoring beginnen, sollten wir ein klares Refactoring-Ziel festlegen. Wir müssen uns einige Fragen stellen, zum Beispiel: Was sind die Probleme mit diesem Code? Wir müssen umbauen

Wie kann ich C++-Code umgestalten? Wie kann ich C++-Code umgestalten? Nov 04, 2023 pm 04:40 PM

C++ ist eine sehr leistungsfähige, flexible und weit verbreitete Programmiersprache. Mit der kontinuierlichen Weiterentwicklung von Projekten und der fortgesetzten relativen Wiederverwendung von Code wird es jedoch Probleme wie eine Verschlechterung der Codequalität und Lesbarkeit geben. Zu diesem Zeitpunkt muss der Code umgestaltet werden, um eine bessere Codequalität und eine höhere Wartbarkeit zu erreichen. In diesem Artikel erfahren Sie, wie Sie C++-Code umgestalten. Definieren Sie Ihre Ziele Bevor Sie mit der Umgestaltung Ihres Codes beginnen, müssen Sie definieren, was Sie erreichen möchten. Beispielsweise möchten Sie möglicherweise die Lesbarkeit des Codes verbessern, die Codeduplizierung reduzieren, die Codeleistung verbessern usw. keiner

Praxis der Python-Leistungsoptimierung: von den Grundlagen bis zum Fortgeschrittenen Praxis der Python-Leistungsoptimierung: von den Grundlagen bis zum Fortgeschrittenen Feb 20, 2024 pm 12:00 PM

Grundlegende Optimierungen Verwenden Sie die richtige Python-Version: Neuere Python-Versionen sind im Allgemeinen leistungsfähiger, bieten eine bessere Speicherverwaltung und integrierte Optimierungen. Wählen Sie die richtige Bibliothek: Sie können Zeit sparen und die Leistung verbessern, indem Sie speziell entwickelte Bibliotheken verwenden, anstatt Code von Grund auf neu zu schreiben. Reduzieren Sie die Anzahl der Schleifen: Vermeiden Sie nach Möglichkeit die Verwendung verschachtelter Schleifen. Die Verwendung von Listenverständnissen und Generatorausdrücken sind effizientere Alternativen. Durch die Optimierung der Datenstruktur wird der richtige Container ausgewählt: Listen eignen sich für den Direktzugriff, Wörterbücher für schnelle Schlüsselwertsuchen und Tupel für unveränderliche Daten. Vorab zugewiesenen Speicher verwenden: Durch die Vorabzuweisung der Größe eines Arrays oder einer Liste können Sie den Aufwand für die Speicherzuweisung und -defragmentierung reduzieren. Nutzung von Numpy und Pandas: Für wissenschaftliches Rechnen und Datenanalysen bietet Num

Schlüsselkompetenzen zur Codeoptimierung in der Leistungsoptimierung des Java-Frameworks Schlüsselkompetenzen zur Codeoptimierung in der Leistungsoptimierung des Java-Frameworks Jun 03, 2024 pm 01:16 PM

Bei der Leistungsoptimierung des Java-Frameworks ist die Codeoptimierung von entscheidender Bedeutung, einschließlich: 1. Reduzierung der Objekterstellung; Wenn Sie diese Tipps befolgen, können Sie die Leistung des Frameworks verbessern, indem Sie beispielsweise Hibernate-Abfragen optimieren, um die Anzahl der Datenbankaufrufe zu reduzieren.

See all articles