Loading/unloading 动态外部JS
Loading/unloading external JS dynamically
在尝试模仿像 Youtube 这样的网站,并在 link 单击时仅加载页面的特定片段的过程中,我尝试制作一个 loads/unloads 特定 JS 文件和CSS 当前页面需要的文件。
我注意到当 CSS 文件从 DOM 中删除时,该文件的样式不再有效,只有在我添加特定的 [=11] 后才会再次有效=] 再次标记。但是,似乎 JS 文件在加载时存储在内存中,并且简单地删除 DOM 中的引用并不会阻止与该文件关联的函数仍然有效。 Youtube 如何解决这个问题,或者您对我应该走哪条路有自己的建议 unloading/loading JS 文件 "completely"?
我的一个想法是让我的代码中的所有变量、元素 ID 等(涉及 HTML 和 JS 时)都是唯一的,并有一个数组来检查哪个 JS文件已加载 - 因此内存中的每个 JS 文件不会超过一个。但我想这不是一个安全的解决方案,因为如果 "page" 长时间未使用,GC 可以从内存中删除 JS 文件?
你可以设置一个变量为空,然后垃圾收集器将从内存中清除它,这样你就可以将你的 javascript 动态加载到一个变量中,这样以后你就可以设置它为空。您的文件可以有一个 object 或者是一个构造函数。
这只是一个基本的解释,但是,我的建议是您可以查看 angularjs、reactjs 和许多其他适合开发单页应用程序的框架。
如果您已经开发了一些东西,requierejs 是一个用于动态加载依赖项的库,实现起来非常简单。
缓存是另一回事,您可以 avoid/refresh 通过加载文件的方式进行缓存。您可以使用例如时间戳将查询参数添加到 url。这样文件的 url 每次都会不同,浏览器不会从缓存中加载它。您还可以使用 headers 来告诉浏览器何时应该从缓存中刷新文件,或者甚至完全阻止它缓存它。
在尝试模仿像 Youtube 这样的网站,并在 link 单击时仅加载页面的特定片段的过程中,我尝试制作一个 loads/unloads 特定 JS 文件和CSS 当前页面需要的文件。
我注意到当 CSS 文件从 DOM 中删除时,该文件的样式不再有效,只有在我添加特定的 [=11] 后才会再次有效=] 再次标记。但是,似乎 JS 文件在加载时存储在内存中,并且简单地删除 DOM 中的引用并不会阻止与该文件关联的函数仍然有效。 Youtube 如何解决这个问题,或者您对我应该走哪条路有自己的建议 unloading/loading JS 文件 "completely"?
我的一个想法是让我的代码中的所有变量、元素 ID 等(涉及 HTML 和 JS 时)都是唯一的,并有一个数组来检查哪个 JS文件已加载 - 因此内存中的每个 JS 文件不会超过一个。但我想这不是一个安全的解决方案,因为如果 "page" 长时间未使用,GC 可以从内存中删除 JS 文件?
你可以设置一个变量为空,然后垃圾收集器将从内存中清除它,这样你就可以将你的 javascript 动态加载到一个变量中,这样以后你就可以设置它为空。您的文件可以有一个 object 或者是一个构造函数。
这只是一个基本的解释,但是,我的建议是您可以查看 angularjs、reactjs 和许多其他适合开发单页应用程序的框架。
如果您已经开发了一些东西,requierejs 是一个用于动态加载依赖项的库,实现起来非常简单。
缓存是另一回事,您可以 avoid/refresh 通过加载文件的方式进行缓存。您可以使用例如时间戳将查询参数添加到 url。这样文件的 url 每次都会不同,浏览器不会从缓存中加载它。您还可以使用 headers 来告诉浏览器何时应该从缓存中刷新文件,或者甚至完全阻止它缓存它。