UITableView中CIFilter实时转灰度图的性能优化及旧设备模拟测试咨询

问题背景 #

我使用以下代码在UITableView的UIImageView显示图片前将其转换为灰度图：

extension UIImage {
    var noir: UIImage? {
        let contextForGrayscale = CIContext(options: nil)
        guard let currentFilter = CIFilter(name: "CIPhotoEffectNoir") else { return nil }
        currentFilter.setValue(CIImage(image: self), forKey: kCIInputImageKey)
        if let output = currentFilter.outputImage,
            let cgImage = contextForGrayscale.createCGImage(output, from: output.extent) {
            return UIImage(cgImage: cgImage, scale: scale, orientation: imageOrientation)
        }
        return nil
    }
}

目前在iPhone 13上滚动UITableView时实时转换图片无卡顿，但没有旧设备测试，想了解两个问题：

1. 这种实时转灰度图并展示的方式是否高效？有哪些优化方法？
2. 是否有办法让自己的手机变慢，模拟旧设备进行性能测试？

问题解答 #

1. 实时转灰度图的效率与优化方法 #

当前实现的效率并不理想，核心问题有两个：

• 每次调用noir属性都会重新创建CIContext，这个对象初始化成本很高，重复创建会在旧设备上带来明显的性能损耗。
• 滚动时在主线程处理图片转换，会抢占UI渲染的资源，旧设备CPU/GPU性能有限，很容易出现掉帧卡顿。

具体优化方案：

• 复用CIContext：把CIContext做成全局单例，避免重复初始化。可以在UIImage的extension里定义静态实例：

  extension UIImage {
      private static let grayscaleContext = CIContext(options: [
          .useSoftwareRenderer: false, // 优先GPU加速，旧设备不支持会自动 fallback 到CPU
          .priorityRequestLow: true    // 降低渲染优先级，避免干扰UI主线程
      ])
      
      var noir: UIImage? {
          guard let currentFilter = CIFilter(name: "CIPhotoEffectNoir") else { return nil }
          currentFilter.setValue(CIImage(image: self), forKey: kCIInputImageKey)
          if let output = currentFilter.outputImage,
              let cgImage = Self.grayscaleContext.createCGImage(output, from: output.extent) {
              return UIImage(cgImage: cgImage, scale: scale, orientation: imageOrientation)
          }
          return nil
      }
  }
  

• 后台线程处理+缓存：不在主线程做转换，用后台队列处理，同时缓存转换后的图片避免重复计算：

  // 全局缓存实例
  let imageCache = NSCache<NSString, UIImage>()
  
  func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
      let cell = tableView.dequeueReusableCell(withIdentifier: "Cell", for: indexPath) as! CustomCell
      let originalImage = yourOriginalImageArray[indexPath.row]
      let cacheKey = NSString(string: "\(indexPath.row)_grayscale")
      
      // 先读缓存
      if let cachedGrayImage = imageCache.object(forKey: cacheKey) {
          cell.imageView.image = cachedGrayImage
          return cell
      }
      
      // 后台处理图片
      DispatchQueue.global(qos: .userInitiated).async {
          guard let grayImage = originalImage.noir else { return }
          self.imageCache.setObject(grayImage, forKey: cacheKey)
          // 回到主线程更新UI，避免cell复用错误
          DispatchQueue.main.async {
              if tableView.indexPath(for: cell) == indexPath {
                  cell.imageView.image = grayImage
              }
          }
      }
      
      // 设置占位图
      cell.imageView.image = UIImage(named: "placeholder")
      return cell
  }
  

• 换轻量的Core Graphics转换：如果不需要CIPhotoEffectNoir的额外滤镜效果（它会调整对比度），用Core Graphics直接转灰度性能更好：

  extension UIImage {
      var grayscale: UIImage? {
          guard let cgImage = cgImage else { return nil }
          let width = Int(size.width)
          let height = Int(size.height)
          
          let context = CGContext(data: nil,
                                  width: width,
                                  height: height,
                                  bitsPerComponent: 8,
                                  bytesPerRow: 0,
                                  space: CGColorSpaceCreateDeviceGray(),
                                  bitmapInfo: CGImageAlphaInfo.none.rawValue)
          
          guard let cgContext = context else { return nil }
          cgContext.draw(cgImage, in: CGRect(origin: .zero, size: size))
          
          guard let grayCGImage = cgContext.makeImage() else { return nil }
          return UIImage(cgImage: grayCGImage, scale: scale, orientation: imageOrientation)
      }
  }
  

• 提前预处理图片：如果是本地图片资源，在APP启动或首次加载时就批量转换成灰度图并保存到本地，滚动时直接加载处理好的文件，彻底规避实时转换的性能开销。

2. 模拟旧设备性能的测试方法 #

• Xcode模拟器模拟：
  • 选择旧设备型号（比如iPhone 7、iPhone SE 2016）启动模拟器。
  • 开启Debug > Debug Workflow > Slow Animations（快捷键⌘+T）放慢动画，直观感受卡顿。
  • 打开Debug > Show FPS查看帧率，判断是否掉帧。
• 真机性能限制：
  • 打开iPhone的设置 > 辅助功能 > 动态效果 > 减弱动态效果，关闭不必要的动画，模拟旧设备的动画表现。
  • 使用Xcode Instruments工具：连接真机后，选择Core Animation查看渲染耗时，Time Profiler追踪CPU占用，Energy Log查看功耗情况（旧设备续航与性能关联紧密）。
  • 手动制造高负载：后台打开多个大型APP，同时播放视频，模拟旧设备资源不足的状态。
  • Xcode环境覆盖：调试会话中点击调试栏的Environment Overrides按钮（小太阳图标），设置CPU Throttling（比如限制到2核或降低CPU性能），模拟旧设备的CPU算力。

内容的提问来源于stack exchange，提问作者sudoExclamationExclamation