万科网络科技

<?php
/**
 * 识别访问设备类型
 * @return string 'mobile'|'pc'|'tablet'
 */
function detectDevice() {
    // 获取User-Agent（兼容CLI/无UA场景）
    $userAgent = isset($_SERVER['HTTP_USER_AGENT']) ? strtolower($_SERVER['HTTP_USER_AGENT']) : '';
    
    // 移动端关键词（覆盖主流手机/AI浏览器）
    $mobileKeywords = ['android', 'iphone', 'ipad', 'ipod', 'windows phone', 'ai browser', 'chatgpt bot'];
    // 平板关键词（单独区分，避免和手机混淆）
    $tabletKeywords = ['ipad', 'android tablet', 'kindle fire'];

    // 优先判断平板
    foreach ($tabletKeywords as $keyword) {
        if (strpos($userAgent, $keyword) !== false) {
            return 'tablet';
        }
    }
    // 判断移动端
    foreach ($mobileKeywords as $keyword) {
        if (strpos($userAgent, $keyword) !== false) {
            return 'mobile';
        }
    }
    // 默认PC端
    return 'pc';
}

// 调用示例
$deviceType = detectDevice();
?>

<?php
/**
 * 压缩HTML输出（轻量化核心）
 * @param string $html 原始HTML内容
 * @return string 压缩后的HTML
 */
function compressHtml($html) {
    // 保留<pre>和<code>标签内的内容不压缩
    $preserveBlocks = [];
    preg_match_all('/<(pre|code)[^>]*>.*?<\/\1>/is', $html, $matches);
    foreach ($matches[0] as $i => $block) {
        $preserveBlocks[$i] = $block;
        $html = str_replace($block, "{{preserve_$i}}", $html);
    }

    // 压缩规则：移除注释、空行、多余空格
    $html = preg_replace('/<!--.*?-->/s', '', $html); // 移除HTML注释
    $html = preg_replace('/\s+/', ' ', $html); // 多个空格/换行替换为单个空格
    $html = preg_replace('/>\s+</', '><', $html); // 标签间的空格移除
    $html = trim($html); // 首尾空格

    // 还原保留的<pre>/<code>块
    foreach ($preserveBlocks as $i => $block) {
        $html = str_replace("{{preserve_$i}}", $block, $html);
    }

    return $html;
}
?>

<?php
// 模拟从数据库获取文章内容（实际项目中优化查询，只查需要的字段）
$article = [
    'title' => 'PHP响应式轻量化输出实战',
    'content' => '核心内容...',
    'full_content' => '核心内容+扩展内容...',
    'image' => 'https://example.com/images/original.jpg'
];

// 响应式图片尺寸（根据设备适配）
$imageSizes = [
    'mobile' => '480w',
    'tablet' => '768w',
    'pc' => '1200w'
];
$currentImageSize = $imageSizes[$deviceType];
// PHP拼接响应式图片URL（也可结合CDN生成不同尺寸）
$responsiveImageUrl = str_replace('original.jpg', "{$currentImageSize}.jpg", $article['image']);
?>

<!-- 基础视口设置（响应式前端基础，PHP动态输出） -->
<meta name="viewport" content="width=device-width, initial-scale=1.0">

<!-- 核心内容：所有设备都输出，保证AI/用户能获取核心信息 -->
<main>
    <h1><?php echo htmlspecialchars($article['title']); ?></h1>
    <!-- 响应式图片：轻量化（只加载当前设备需要的尺寸） -->
    <img src="<?php echo htmlspecialchars($responsiveImageUrl); ?>" 
         alt="<?php echo htmlspecialchars($article['title']); ?>"
         loading="lazy"> <!-- 懒加载进一步轻量化 -->
    
    <!-- 按需输出内容：移动端只输出核心内容，减少体积 -->
    <div class="article-content">
        <?php if ($deviceType === 'mobile'): ?>
            <?php echo htmlspecialchars($article['content']); ?>
        <?php else: ?>
            <?php echo htmlspecialchars($article['full_content']); ?>
        <?php endif; ?>
    </div>
</main>

<!-- 响应式侧边栏：移动端隐藏，减少渲染和加载成本 -->
<?php if ($deviceType !== 'mobile'): ?>
    <aside class="sidebar">
        <!-- PC/平板端侧边栏内容 -->
    </aside>
<?php endif; ?>

<?php
// 按需加载CSS
if ($deviceType === 'mobile'): ?>
    <link rel="stylesheet" href="/css/mobile.min.css"> <!-- 移动端精简CSS -->
<?php else: ?>
    <link rel="stylesheet" href="/css/pc.min.css"> <!-- PC端完整CSS -->
<?php endif; ?>

// 按需加载JS（非核心JS延迟加载）
<script defer src="/js/common.min.js"></script> <!-- 所有设备通用的轻量化JS -->
<?php if ($deviceType === 'pc'): ?>
    <script defer src="/js/pc-extra.min.js"></script> <!-- PC端额外JS -->
<?php endif; ?>

<?php
// 缓存键：结合设备类型+页面ID，保证不同设备缓存独立
$cacheKey = 'article_' . $article['id'] . '_' . $deviceType;
$cacheFile = __DIR__ . '/cache/' . $cacheKey . '.html';
$cacheExpire = 3600; // 缓存1小时

// 检查缓存是否存在且未过期
if (file_exists($cacheFile) && (time() - filemtime($cacheFile)) < $cacheExpire) {
    // 直接输出缓存内容（已压缩，轻量化）
    echo file_get_contents($cacheFile);
    exit;
}

// 缓存不存在，渲染内容
ob_start(); // 开启输出缓冲
?>

<!-- 这里放前面的响应式HTML内容 -->

<?php
// 获取渲染后的内容并压缩
$output = compressHtml(ob_get_clean());

// 写入缓存（确保cache目录可写）
file_put_contents($cacheFile, $output);

// 输出最终内容
echo $output;
?>