gulp.browersync的机制是什么?例如多个浏览器的 cssinject 和 sync-scroll
What is the mechanism of gulp.browersync? Such as cssinject and sync-scroll for multiple browsers
gulp.browersync 对我来说就像黑魔法。我想了解它使用的技术。
在css-injection中,浏览器如何知道css文件被改变了?为什么不用刷新就可以重绘页面?为什么 .html/.js 更新不是这样?
当有多个浏览器打开同步页面时,如果其中一个向下滚动,其他浏览器将跟随。为什么?哪些动作可以同步,哪些不可以?真的很厉害。
根据我的理解,Browsersync 是一项可以做一些事情的服务...
当它在您的页面中注入一个 Javascript 文件时(请参阅您页面的源代码),黑魔法就出现了。如何?它在特定端口侦听连接(创建代理服务器),然后修改您的页面。
注入的 JS 监听服务正在发送的命令,通过网络套接字等技术......或者我认为对旧浏览器的简单异步请求......
例如,当您移动鼠标时,它会向其他页面发送类似的命令来复制状态...
还有 Browsersync,如果 运行,会持续监视您指定要监视的文件,例如 CSS 文件...并在这些文件发生更改时发送所需的命令。
许多自动化工具,如 Grunt 或 Gulp 可以与它集成,以获得您能想象到的最酷的开发工作流程...测试多个设备、重建缓存等等...
是的...这就像黑魔法 :D
在此处查看正在运行的 Browsersync 请求:https://webmshare.com/ovwGg
我也是 browsersync 的新手,目前我发现的内容如下:
BrowserSync 是一种自动化工具,可加快 Web 开发速度。
BrowserSync 允许您在工作目录周围启动本地 Web 服务器,以便通过将目标页面及其相关文件指向本地主机 URL,可以在连接到家庭网络的所有设备上立即访问它们。此外,它支持实时重新加载,因此您对页面或其 CSS 所做的任何更改都会触发所有连接设备上的浏览器刷新,供您预览。
BrowserSync 就像一个 LiveReload(它监视您对网页所做的更改并自动更新浏览器),除了它还适用于多个设备。
BrowserSync 能够在一个浏览器中滚动,并在所有其他浏览器中看到该操作的镜像。
动作同步功能(默认启用)会将滚动位置、点击和表单输入从一个浏览器复制到所有其他已连接的浏览器。
一些有用的 links:
https://scotch.io/tutorials/how-to-use-browsersync-for-faster-development
http://www.javascriptkit.com/howto/mobilefriendly2.shtml
http://www.creativebloq.com/web-design/test-your-sites-multiple-devices-81516496
我在使用 browsersync 的过程中遇到了一个问题,如果这里有人有兴趣回答可以访问 link:How to sync the actions performed on webpage using Browsersync?。
gulp.browersync 对我来说就像黑魔法。我想了解它使用的技术。
在css-injection中,浏览器如何知道css文件被改变了?为什么不用刷新就可以重绘页面?为什么 .html/.js 更新不是这样?
当有多个浏览器打开同步页面时,如果其中一个向下滚动,其他浏览器将跟随。为什么?哪些动作可以同步,哪些不可以?真的很厉害。
根据我的理解,Browsersync 是一项可以做一些事情的服务...
当它在您的页面中注入一个 Javascript 文件时(请参阅您页面的源代码),黑魔法就出现了。如何?它在特定端口侦听连接(创建代理服务器),然后修改您的页面。
注入的 JS 监听服务正在发送的命令,通过网络套接字等技术......或者我认为对旧浏览器的简单异步请求......
例如,当您移动鼠标时,它会向其他页面发送类似的命令来复制状态...
还有 Browsersync,如果 运行,会持续监视您指定要监视的文件,例如 CSS 文件...并在这些文件发生更改时发送所需的命令。
许多自动化工具,如 Grunt 或 Gulp 可以与它集成,以获得您能想象到的最酷的开发工作流程...测试多个设备、重建缓存等等...
是的...这就像黑魔法 :D
在此处查看正在运行的 Browsersync 请求:https://webmshare.com/ovwGg
我也是 browsersync 的新手,目前我发现的内容如下:
BrowserSync 是一种自动化工具,可加快 Web 开发速度。 BrowserSync 允许您在工作目录周围启动本地 Web 服务器,以便通过将目标页面及其相关文件指向本地主机 URL,可以在连接到家庭网络的所有设备上立即访问它们。此外,它支持实时重新加载,因此您对页面或其 CSS 所做的任何更改都会触发所有连接设备上的浏览器刷新,供您预览。
BrowserSync 就像一个 LiveReload(它监视您对网页所做的更改并自动更新浏览器),除了它还适用于多个设备。
BrowserSync 能够在一个浏览器中滚动,并在所有其他浏览器中看到该操作的镜像。
动作同步功能(默认启用)会将滚动位置、点击和表单输入从一个浏览器复制到所有其他已连接的浏览器。 一些有用的 links:
https://scotch.io/tutorials/how-to-use-browsersync-for-faster-development
http://www.javascriptkit.com/howto/mobilefriendly2.shtml
http://www.creativebloq.com/web-design/test-your-sites-multiple-devices-81516496
我在使用 browsersync 的过程中遇到了一个问题,如果这里有人有兴趣回答可以访问 link:How to sync the actions performed on webpage using Browsersync?。