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

Whittle away at inline <script> tags #1298

Open
cpeel opened this issue Aug 9, 2024 · 8 comments
Open

Whittle away at inline <script> tags #1298

cpeel opened this issue Aug 9, 2024 · 8 comments

Comments

@cpeel
Copy link
Member

cpeel commented Aug 9, 2024

Ideally we would have no inline JS which would allow us to tighten down our Content Security Policy. That's going to be hard to remove entirely, but if we can remove all of the pages that specify <script> we can use a nonce to cover the ones included in output_header() and slim_header() via $extra_args["js_data"] (see https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/script-src#unsafe_inline_script).

So we should:

  • Move JS code to .js files when possible
  • Any code we can't move to .js. files needs to be lifted into $extra_args["js_data"] so it can be covered under a (to-be-developed) nonce mechanism.

Closing this ticket would be having no <script> content in PHP code outside that created in html_page_common.inc and a nonce mechanism cover the header-inserted code.

@chrismiceli
Copy link
Collaborator

If we do ever get to disable inline scripts, be aware that I believe it may break people's extensions, which is kind of the point, but we may get some feedback in that regard.

@cpeel
Copy link
Member Author

cpeel commented Aug 14, 2024

@chrismiceli - do you have thoughts or suggestions on how to reduce the number of individual .js files that we create as part of this effort? I know that it's a best practice to reduce the number of round-trips to the server and this feels like we'll be creating a bunch of individual .js files.

@chrismiceli
Copy link
Collaborator

@chrismiceli - do you have thoughts or suggestions on how to reduce the number of individual .js files that we create as part of this effort? I know that it's a best practice to reduce the number of round-trips to the server and this feels like we'll be creating a bunch of individual .js files.

We definitely could create 1 or more minified bundles based on usage patterns or roles, but really I'm not 100% sure it is worth the effort. With http1.1 with keep alive or http2/3, there is only 1 TCP connection per server so there isn't a huge penalty to not bundling. Even more modern sites are kind of going away with it and instead having tons of es modules with various imports, etc.

Minifying would probably be trivial to do and reduce page load size, but our client side performance according to lighthouse is already really good: https://pagespeed.web.dev/analysis/https-www-pgdp-net-c/wf00h7vgv8?form_factor=desktop. Minifying does make debugging harder, but not really that much to be honest.

If you want me to investigate what these strategies could look like for pgdp, I could, but want to confirm the goals clearly.

@cpeel
Copy link
Member Author

cpeel commented Aug 15, 2024

tl;dr: Hold off on any investigation until I see if we can support http/2.

I'm less worried about making them smaller than making fewer of them. With http 1.1 the client makes up to 6 TCP concurrent TCP connections to the server per browser -- because of keepalive more than one resource will be downloaded on that connection though. We're currently hitting a resources limit on PROD with the number of concurrent connections under high load. Having clients have more files to download will only make that worse (although only slightly worse due to caching). http/2 would be much more efficient but we can't currently support it because it requires a non-prefork Apache MPM, but mod_php will only work with the prefork MPM. To move to a non-prefork MPM we have to move to php-fpm which, in theory, will work but I have some concerns with how gettext will work with php-fpm due to how it works.

I need to do some testing on TEST to see if we can move to php-fpm and then I'd rather do that and evaluate how things go before doing any major research or work on reducing the number of .js (and .css) resources our pages request.

@70ray
Copy link
Collaborator

70ray commented Oct 29, 2024

The majority of remaining inline JS is in the following areas which we are intending to revise for other reasons:

  • The proofreading interface (toolbox, preview, wordcheck, proofframe)
  • pinc/js_newwin.inc which is used in various places. This does not now work how it was originally intended because of changes in browsers to discourage use of pop-up windows and is inconsistent in different browsers. See issue Target new Tab instead of pop-up windows #405.
  • tools/project_manager/diff.php. See pull request Link "skip empty diffs" with "without formatting" #1114
  • tools/authors. Was ther some discussion of removing this entirely?

@cpeel
Copy link
Member Author

cpeel commented Oct 30, 2024

tools/authors. Was ther some discussion of removing this entirely?

Yes, this code is getting deleted completely, probably after the next code release but maybe before. (see https://www.pgdp.net/phpBB3/viewtopic.php?t=82401)

@70ray
Copy link
Collaborator

70ray commented Nov 15, 2024

A common case is getting translated strings into javascript functions. Should we standardize the way we do this, particularly in the new Proofreading Interface. Perhaps using an API to get an array of translated strings would avoid any security issues?

@chrismiceli
Copy link
Collaborator

I've seen a couple of different approaches, but we could do an API or just dump in them in the DOM as some JSON on a data-attribute or something as well. That would avoid another round to the server.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants