- Set up ESLint and Prettier for code quality - Split large script.js into modular architecture (DOM, animations, effects, easter-eggs, sound, interactions) - Organize assets into proper directory structure (assets/css, assets/js/modules, assets/images) - Add semantic HTML5 landmarks (header, main, nav, footer) - Implement ARIA labels and keyboard navigation for accessibility - Set up Vite build system with minification and optimization - Add CSS custom properties for design tokens - Create sitemap.xml and robots.txt for SEO - Add MIT LICENSE - Expand README with comprehensive documentation - Set up GitHub Actions CI/CD workflow - Optimize build output: ~59KB total (30KB image + 13KB CSS + 16KB JS gzipped) Co-authored-by: ZaneThePython <102631678+ZaneThePython@users.noreply.github.com>
43 lines
1009 B
JavaScript
43 lines
1009 B
JavaScript
// DOM utility functions and element caching
|
|
export const DOM = {
|
|
// Cache frequently accessed elements
|
|
cache: {},
|
|
|
|
// Get and cache element
|
|
get(selector) {
|
|
if (!this.cache[selector]) {
|
|
this.cache[selector] = document.querySelector(selector);
|
|
}
|
|
return this.cache[selector];
|
|
},
|
|
|
|
// Get all and cache elements
|
|
getAll(selector) {
|
|
if (!this.cache[selector]) {
|
|
this.cache[selector] = document.querySelectorAll(selector);
|
|
}
|
|
return this.cache[selector];
|
|
},
|
|
|
|
// Clear cache
|
|
clearCache() {
|
|
this.cache = {};
|
|
},
|
|
};
|
|
|
|
// Navigation elements
|
|
export const getNavElements = () => ({
|
|
navButtons: DOM.getAll('.nav-button'),
|
|
contentSections: DOM.getAll('.content-section'),
|
|
closeButtons: DOM.getAll('.close-button'),
|
|
});
|
|
|
|
// Main UI elements
|
|
export const getMainElements = () => ({
|
|
avatar: DOM.get('.avatar'),
|
|
brandName: DOM.get('.brand-name'),
|
|
tagline: DOM.get('.tagline'),
|
|
aboutText: DOM.get('.about-text'),
|
|
disclaimer: DOM.get('.disclaimer'),
|
|
});
|