Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Replace browser-sync with new dev server #1305

Closed
zachleat opened this issue Jul 7, 2020 · 13 comments
Closed

Replace browser-sync with new dev server #1305

zachleat opened this issue Jul 7, 2020 · 13 comments
Assignees
Labels
breaking-change This will have to be included with a major version as it breaks backwards compatibility.

Comments

@zachleat
Copy link
Member

zachleat commented Jul 7, 2020

As our fearless browser-sync dependency may not be maintained any longer, we may want to investigate possible replacements—as I’d rather not implement this functionality in Eleventy myself though that is a possible option.

via #1164 (comment)

If you’ve heard of a good alternative, please list it here!

@zachleat zachleat added the needs-discussion Please leave your opinion! This request is open for feedback from devs. label Jul 7, 2020
@cristianl
Copy link

I'd like to collaborate on this. I've wanted a lightweight alternative (famous last words) to browser-sync and livereload, but it seems pointless to cobble together something that doesn't integrate well with future projects and other tools. Eleventy would be an amazing stress test/launchpad for this 🤗

Ghost mode is the main selling point of browser-sync, but it seems to account for most of the dependencies, and also adds jank on some pages/devices.


I've seen a simpler but effective implementation (sapper I think?) using Server Sent Events instead of websockets.

DOM injection is really great for designing in the browser despite some edge cases. It makes for cool demo gifs too.

@cristianl
Copy link

In the meantime, would a fork of the browsersync server package with dep bumps be acceptable?

Only yargs@15 needs a change to code (version() no longer accepts a function as its argument).

Tests: 466 passing / 18 pending (on current node 10, 12 and 14), same as before bumps

@brycewray
Copy link

Thanks for the heads-up, @zachleat — have replaced browser-sync with svrx for my local testing builds, and am liking it quite a bit better already.

@cj81499
Copy link

cj81499 commented Jul 17, 2020

One of my favorite browser-sync features is cross-browser synchronization (scroll/click in one window, and other windows opened to the same page will do the same).

I hope that if browser-sync is replaced, we can keep that functionality. It makes cross-browser testing (chrome/firefox/safari/etc) much easier.

@brycewray
Copy link

One of my favorite browser-sync features is cross-browser synchronization (scroll/click in one window, and other windows opened to the same page will do the same).

I hope that if browser-sync is replaced, we can keep that functionality. It makes cross-browser testing (chrome/firefox/safari/etc) much easier.

That's the "ghost mode." I guess it's an to-each-his-own kind of thing. I found it creepy until I learned it was supposed to do that. 😄

@sjml
Copy link

sjml commented Aug 4, 2020

With browser-sync updating, are you still interested in replacing it? Given #841 and #843 being listed as part of the 1.0 release, is there anything else it's doing that you would prefer to keep? (Something like svrx seems to have more flexibility, for instance, while still being actively developed).

I definitely recognize the value in not breaking what is no longer broken, though...

@rdmurphy
Copy link

👋 I was equally frustrated with browser-sync for similar reasons (but eternally grateful for all its years of service 🙏 ) and ended up creating mini-sync. It uses server-sent events instead of WebSockets to simplify messaging.

It's biggest flaw is it lacks the auto-injection into HTML files that browser-sync has. I can work around that in my uses because they often have a JS build step as well 😅 , but if anyone has any suggestions regarding that or whether it'd work for eleventy, let me know!

@brycewray
Copy link

Re the svrx pacakge, note the following for now: svrxjs/svrx#191

@TigersWay
Copy link
Contributor

My little 2 cents....
I have been using a few times a potential alternative - the only "ALIVE" one I found so far - which may be worth some investigation: Modern Web Dev Server or https://www.npmjs.com/package/@web/dev-server .

@brycewray
Copy link

Looks like @zachleat has got this:

https://www.youtube.com/watch?v=wWs38M38vr8

@zachleat zachleat self-assigned this Mar 8, 2022
@zachleat zachleat removed the needs-discussion Please leave your opinion! This request is open for feedback from devs. label Mar 8, 2022
@zachleat
Copy link
Member Author

zachleat commented Mar 8, 2022

Yeah, thanks @brycewray!

Look for this at https://github.com/11ty/eleventy-dev-server soon

@zachleat zachleat changed the title Investigate possible browser-sync replacements Replace browser-sync with new dev server Mar 9, 2022
@zachleat
Copy link
Member Author

zachleat commented Mar 9, 2022

This is ready for testing on 2.0.0-canary.1!

https://twitter.com/eleven_ty/status/1501586773834612747

@zachleat zachleat closed this as completed Mar 9, 2022
@zachleat zachleat unpinned this issue May 9, 2022
@zachleat zachleat added the breaking-change This will have to be included with a major version as it breaks backwards compatibility. label May 10, 2022
@Hammadi31381
Copy link

Is there an android alternative ??

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
breaking-change This will have to be included with a major version as it breaks backwards compatibility.
Projects
None yet
Development

No branches or pull requests

8 participants