astro Architecture Docs
Home / File/ head.ts — astro Source File

head.ts — astro Source File

Architecture documentation for head.ts, a typescript file in the astro codebase. 5 imports, 0 dependents.

File typescript CoreAstro RenderingEngine 5 imports 4 functions

Entity Profile

Dependency Diagram

graph LR
  fab8dbd2_7a6f_1571_b04b_4d0b3cd4348b["head.ts"]
  10d4e39f_edb6_3e34_aa93_ae1211e7da05["../types/public/internal.js"]
  fab8dbd2_7a6f_1571_b04b_4d0b3cd4348b --> 10d4e39f_edb6_3e34_aa93_ae1211e7da05
  a7eea85d_ea97_57b1_9a24_f99face6a97d["./escape.js"]
  fab8dbd2_7a6f_1571_b04b_4d0b3cd4348b --> a7eea85d_ea97_57b1_9a24_f99face6a97d
  f53796be_99c4_db53_3b21_19bf1fc24f8a["./csp.js"]
  fab8dbd2_7a6f_1571_b04b_4d0b3cd4348b --> f53796be_99c4_db53_3b21_19bf1fc24f8a
  ff0be6cd_e34f_b283_f541_4038fdcadce5["./instruction.js"]
  fab8dbd2_7a6f_1571_b04b_4d0b3cd4348b --> ff0be6cd_e34f_b283_f541_4038fdcadce5
  f6f0048c_504d_27bf_f669_9d6d4a931037["./util.js"]
  fab8dbd2_7a6f_1571_b04b_4d0b3cd4348b --> f6f0048c_504d_27bf_f669_9d6d4a931037
  style fab8dbd2_7a6f_1571_b04b_4d0b3cd4348b fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

import type { SSRResult } from '../../../types/public/internal.js';
import { markHTMLString } from '../escape.js';
import { renderCspContent } from './csp.js';
import type { MaybeRenderHeadInstruction, RenderHeadInstruction } from './instruction.js';
import { createRenderInstruction } from './instruction.js';
import { renderElement } from './util.js';

// Filter out duplicate elements in our set
const uniqueElements = (item: any, index: number, all: any[]) => {
	const props = JSON.stringify(item.props);
	const children = item.children;
	return (
		index === all.findIndex((i) => JSON.stringify(i.props) === props && i.children == children)
	);
};

export function renderAllHeadContent(result: SSRResult) {
	result._metadata.hasRenderedHead = true;
	let content = '';
	if (result.shouldInjectCspMetaTags && result.cspDestination === 'meta') {
		content += renderElement(
			'meta',
			{
				props: {
					'http-equiv': 'content-security-policy',
					content: renderCspContent(result),
				},
				children: '',
			},
			false,
		);
	}
	const styles = Array.from(result.styles)
		.filter(uniqueElements)
		.map((style) =>
			style.props.rel === 'stylesheet'
				? renderElement('link', style)
				: renderElement('style', style),
		);
	// Clear result.styles so that any new styles added will be inlined.
	result.styles.clear();
	const scripts = Array.from(result.scripts)
		.filter(uniqueElements)
		.map((script) => {
			if (result.userAssetsBase) {
				script.props.src =
					(result.base === '/' ? '' : result.base) + result.userAssetsBase + script.props.src;
			}
			return renderElement('script', script, false);
		});
	const links = Array.from(result.links)
		.filter(uniqueElements)
		.map((link) => renderElement('link', link, false));

	// Order styles -> links -> scripts similar to src/content/runtime.ts
	// The order is usually fine as the ordering between these groups are mutually exclusive,
	// except for CSS styles and CSS stylesheet links. However CSS stylesheet links usually
	// consist of CSS modules which should naturally take precedence over CSS styles, so the
	// order will still work. In prod, all CSS are stylesheet links.
	// In the future, it may be better to have only an array of head elements to avoid these assumptions.
	content += styles.join('\n') + links.join('\n') + scripts.join('\n');

	if (result._metadata.extraHead.length > 0) {
		for (const part of result._metadata.extraHead) {
			content += part;
		}
	}

	return markHTMLString(content);
}

export function renderHead(): RenderHeadInstruction {
	return createRenderInstruction({ type: 'head' });
}

// This function is called by Astro components that do not contain a <head> component
// This accommodates the fact that using a <head> is optional in Astro, so this
// is called before a component's first non-head HTML element. If the head was
// already injected it is a noop.
export function maybeRenderHead(): MaybeRenderHeadInstruction {
	// This is an instruction informing the page rendering that head might need rendering.
	// This allows the page to deduplicate head injections.
	return createRenderInstruction({ type: 'maybe-head' });
}

Domain

Subdomains

Functions

Dependencies

  • ../types/public/internal.js
  • ./csp.js
  • ./escape.js
  • ./instruction.js
  • ./util.js

Source

Frequently Asked Questions

What does head.ts do?
head.ts is a source file in the astro codebase, written in typescript. It belongs to the CoreAstro domain, RenderingEngine subdomain.
What functions are defined in head.ts?
head.ts defines 4 function(s): maybeRenderHead, renderAllHeadContent, renderHead, uniqueElements.
What does head.ts depend on?
head.ts imports 5 module(s): ../types/public/internal.js, ./csp.js, ./escape.js, ./instruction.js, ./util.js.
Where is head.ts in the architecture?
head.ts is located at packages/astro/src/runtime/server/render/head.ts (domain: CoreAstro, subdomain: RenderingEngine, directory: packages/astro/src/runtime/server/render).

Analyze Your Own Codebase

Get architecture documentation, dependency graphs, and domain analysis for your codebase in minutes.

Try Supermodel Free