artin/sourcegraph
1
0
Fork 0
mirror of https://github.com/sourcegraph/sourcegraph.git synced 2026-02-06 16:51:55 +00:00
Code Issues Packages Projects Releases Wiki Activity
975b14f244
sourcegraph/client/web
History
Felix Kling 5c9b7151cb
refactor(svelte): Optimize welcome overlay screenshot assets (#64344) 
The screenshot images for the welcome overlay (both in Svelte and React)
are quite large.
In Svelte specifically, because they are implemented as Svelte
components, this adds a lot of code to the root layout and makes the
bundle quite large.

This commit converts the Svelte components to image files and passes
them (and the React ones) through [svgo](https://github.com/svg/svgo).

On one hand that makes the images much smaller, on the other hand in
Svelte the images are now independent of the JS code and can be loaded
separately (the React app was already using an `img` element).

Before svgo:

```
$ ls src/lib/assets/
total 3.1M
5.1K Aug  7 18:45 sourcegraph-logo.svg
1.5M Aug  7 18:46 welcome-screenshot-dark.svg
1.6M Aug  7 18:46 welcome-screenshot-light.svg
```

After svgo:

```
$ ls src/lib/assets/
total 1.4M
5.1K Aug  7 18:45 sourcegraph-logo.svg
667K Aug  7 18:50 welcome-screenshot-dark.svg
667K Aug  7 18:50 welcome-screenshot-light.svg
```

## Test plan

I temporarily changed the code so that the welcome dialog is always
shown in the Svelte app and inspected the image. It still seems to look
the same.
2024-08-07 17:37:27 +00:00
..
__mocks__ reapply "switch from jest to vitest for faster, simpler tests (#57886)" (#58145) 2023-11-07 12:00:18 +02:00
bookmarklet
dev fix(appliance): Make Appliance URL envvars strings (#64227) 2024-08-01 15:45:25 -07:00
dist refactor(svelte): Optimize welcome overlay screenshot assets (#64344) 2024-08-07 17:37:27 +00:00
src Svelte: more welcome banner behavior updates (#64311) 2024-08-07 08:55:57 -06:00
tests-examples feat(ci): Adds playwright tests for sveltekit to bazel (#62560) 2024-06-06 12:45:05 -06:00
.bazelignore bazel: ignore files generated into src (#45922) 2022-12-21 20:43:29 -08:00
.eslintignore
.stylelintrc.json
BUILD.bazel Svelte: more welcome banner behavior updates (#64311) 2024-08-07 08:55:57 -06:00
bundlesize.config.js Bump code-web-experimental version to 0.2.0 (#63675) 2024-07-05 18:57:38 -03:00
package.json chore(local): hotfix when local client assets become too big (#63807) 2024-07-18 14:20:39 +02:00
README.md Update the legacy link to sg doc (#64017) 2024-08-01 16:18:30 -07:00
statoscope Report bundle size diff in PRs (#42277) 2022-10-12 10:19:51 +02:00
tsconfig.json Create a shared Cody Ignore dataset (#61968) 2024-05-09 13:18:35 +00:00
vitest.config.ts bazel: fix vitest_test in Bazel in sandbox mode (#58274) 2023-11-15 10:14:41 +01:00

README.md

Web Application

Local development

Use sg CLI tool to configure and start local development server. For more information check out the sg documentation.

Our local development server runs by starting both a Caddy HTTPS server and a Node HTTP server. We then can reverse proxy requests to the Node server to serve client assets under HTTPS.

Configuration

Environment variables important for the web server:

  1. WEB_BUILDER_SERVE_INDEX should be set to true to enable serving of an index page.
  2. SOURCEGRAPH_API_URL is used as a proxied API url. By default it points to the https://k8s.sgdev.org.

It's possible to overwrite these variables by creating sg.config.overwrite.yaml in the root folder and adjusting the env section of the relevant command.

Development server

sg start web-standalone

Public API

To use a public API that doesn't require authentication for most of the functionality:

SOURCEGRAPH_API_URL=https://sourcegraph.com sg start web-standalone

Production server

sg start web-standalone-prod

Web app should be available at https://${SOURCEGRAPH_HTTPS_DOMAIN}:${SOURCEGRAPH_HTTPS_PORT}. Build artifacts will be served from <rootRepoPath>/client/web/dist.

Note: If you are unable to use the above commands (e.g. you can't install Caddy), you can use sg run web-standalone-http instead. This will start a development server using only Node, and will be available at http://localhost:${SOURCEGRAPH_HTTP_PORT}.

API proxy

In both environments, server proxies API requests to SOURCEGRAPH_API_URL provided as the .env variable.